Mohammed Ismail
Mohammed Ismail

Reputation: 147

Change Text in Array in Javascript

I have the following list:

    var submenu = localStorage.getItem('SubMenu')
    var submenuList = submenu.split(',');

0: "Ownership"
1: "Skills<br>Dev"
2: "Financing<br/>and ESD"
3: "Socio-Economic<br>Dev"
4: "Access to<br/>Financial Services"
5: "Board Participation"
6: "Employee Structure"
7: "Preferential Procurement"
8: "Enterprise Development"
9: "Supplier Development"

What I want to do is write a forEach statement in Javascript to replace some certain words with my own hard coded work. For example, where Dev appears I want to change it to Development and where Financing<br/>and ESD I want to change it to Empowerment Financing

I tried the replace method of my list but that gives me errors because i am getting confused with my forEach statement

This is what i have tried

submenuList.forEach(word =>{allMenuItems = allMenuItems.replace('Dev','Development')})

Upvotes: 1

Views: 692

Answers (3)

namgold
namgold

Reputation: 1070

Refer to MDN:

The replace() method returns a new string with some or all matches of a pattern replaced by a replacement.

replace() method return new replaced string, not actual replace on the source string, so you should use map instead of forEach because map will take all of the output and return them in new array.

And also, because you want to replace every occurence of 'Dev' or 'Financing<br/>and ESD', you should use replace with regular expressions with global flag. Replace by string pattern will only replace first occurence.

Example code:

var submenu = localStorage.getItem('SubMenu')
var submenuList = submenu.split(',');
var result = submenuList.map(element => element.replace(/Dev/g, 'Development').replace(/Financing<br\/>and ESD/g, 'Empowerment Financing'));

Improvement:

You should replace the string before do split. So you don't need to forEach or map and improve performance.

Example code:

var submenu = localStorage.getItem('SubMenu')
var replacedSubmenu = submenu.replace(/Dev/g, 'Development').replace(/Financing<br\/>and ESD/g, 'Empowerment Financing');
var result = replacedSubmenu.split(',');

Upvotes: 1

Robertino Vasilescu
Robertino Vasilescu

Reputation: 1078

const arr = [
 "Ownership",
 "Skills<br>Dev",
 "Financing<br/>and ESD",
 "Socio-Economic<br>Dev",
 "Access to<br/>Financial Services",
 "Board Participation",
 "Employee Structure",
 "Preferential Procurement",
 "Enterprise Development",
 "Supplier Development"
]

const newArr = [];

for(let item of arr) {
  if(item.endsWith("Dev")) {
    console.log("Dev found");
    newArr.push(item.replace("Dev", "Development"));
  } else {
    newArr.push(item);
  }
}

console.dir(newArr);

Upvotes: 0

Robert May
Robert May

Reputation: 819

forEach doesn't allow you to modify each element like that. Put simply, the word value in your handler is just a value, not a reference to the item in the array. You can either use a for loop to actually get a reference to each element in the array (not recommended), or you can use map to modify each word instead.

submenuList = submenuList.map(
  word => word.replace(
    'Dev',
    'Development'
  )
)

Upvotes: 1

Related Questions