Javascript

How to replace all occurrences of a string in JavaScript

By ayed_amira , on 02/26/2020 , updated on 09/10/2020 - 3 minutes to read
How to replace all occurrences of a string in JavaScript

How to replace all occurrences of a string in JavaScript : The replace() method in Javascript searches within a string for a specified value or regular expression and returns a new string in which the specified values are replaced. However, if a string contains repeated words, the replace() method changes only the first occurrence of a string.


const str = "bulbasaur ivysaur charmander blastoise metapod bulbasaur";
const strRep = str.replace('bulbasaur', 'venusaur');
alert(strRep);

When you run the code, the above script returns :


venusaur ivysaur charmander blastoise metapod bulbasaur

Here you can see, the first “bulbasaur” is replaced by “venusaur” and the second is always the same. So how can you change all the occurrences of a string to Javascript?

Using a regular expression


You can override all occurrences of a string using regular expressions.


String.replace(/text_to_replace/g, '')

Below is an example of the replace function with regular expressions


const str = "bulbasaur ivysaur charmander blastoise metapod bulbasaur Bulbasaur";
const strRep= str.replace(/bulbasaur/g, 'pokemon')
alert(strRep);

Result :


pokemon ivysaur charmander blastoise metapod pokemon Bulbasaur

As you can see in the result, we realize that the last word “Bulbasaur” has not been replaced. The regular expression is therefore case sensitive. To perform a case insensitive replacement, use the i option in the regex:


const str = "bulbasaur ivysaur charmander blastoise metapod bulbasaur Bulbasaur";
const strRep= str.replace(/bulbasaur/gi, 'pokemon')
alert(strRep);

This time the last word has been replaced:


pokemon ivysaur charmander blastoise metapod pokemon pokemon

Be careful if the string contains special characters, it will not work well with regular expressions. I therefore advise you to modify the string using this function:


const deleteSpeChar = (string) => {
  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
}

Using split and join


An alternative solution, although slower than the regular expression, uses two JavaScript functions. The first is the split () function, which truncates a string when it finds a defined pattern (this is case-sensitive), and returns an array with the tokens:


const str = "bulbasaur ivysaur charmander blastoise metapod bulbasaur Bulbasaur";
const tokens = str.split('bulbasur')
alert(tokens) 

Then, you will join the tokens in a new string, this time without separator:


const strJoin= tokens.join('')
alert(strJoin) 

You can directly combine the two functions for simplicity :


const str="bulbasaur ivysaur charmander blastoise metapod bulbasaur Bulbasaur"
const strJoin= str.split('bulbasaur').join('')

More information on this video (The Coding Train)

Back to Javascript Section

Documentation Javascript

ayed_amira

I'm a data scientist. Passionate about new technologies and programming I created this website mainly for people who want to learn more about data science and programming :)

Comments

Leave a comment

Your comment will be revised by the site if needed.