replaceAll() in JavaScript

index.html

<b>1. Use Fail-Safe </b>
<br/> Using more replace() in chain than expected occurrences, this will not harm in anyway but it is not a good practice if because no. of occurrence is not predictable
<br/>
<b>Output : </b>
<div id="UseFailSafe"></div>
<br/>
<hr/>

<b>2. split() join() combination</b>
<br/> This approach will work for any number of occurrences, but more performance costly
<br/>
<b>Output : </b>
<div id="SplitJoin"></div><br/>
<hr/>

<b>3. Using Regular Expression</b>
<br/> Very short and simple regex will work for any no. of occurrences, but error prone for special characters
<br/>
<b>Output : </b>
<div id="RegularExpression"></div> <br/>
<hr/>

<b>4. RegEx with Special Character handling</b>
<br/> Same as previous approach but will handle special characters too
<br/>
<b>Output : </b>
<div id="RegExSpecialCharacter"></div><br/>
<hr/>

<b> 5. Adding replaceAll() to string prototype to use globally</b>
<br/> Above approach is all good, but it is better to place this function to string prototype so can be can from any where across application
<br/>
<b>Output : </b>
<div id="replaceAll"></div>
<hr/>
<hr/>

replaceall-in-javascript.markdown

replaceAll() in JavaScript

A Pen by Ashish Vishwakarma on CodePen.

License.

script.js

var StrToRepalce = new String();

//1. Use Fail-Safe
StrToRepalce = "Scala is a Functional Programming Language. Scala is easy to learn.";
StrToRepalce = StrToRepalce.replace('Scala', 'F#')
  .replace('Scala', 'F#')
  .replace('Scala', 'F#')
  .replace('Scala', 'F#');
document.querySelector("#UseFailSafe").innerHTML = StrToRepalce;

//2. split() join() combination 
StrToRepalce = "Scala is a Functional Programming Language. Scala is easy to learn.";
StrToRepalce = StrToRepalce.split("Scala").join("F#");
document.querySelector("#SplitJoin").innerHTML = StrToRepalce;

//3. Using Regular Expression
StrToRepalce = "Scala is a Functional Programming Language. Scala is easy to learn.";
StrToRepalce = StrToRepalce.replace(/Scala/g, 'F#');
document.querySelector("#RegularExpression").innerHTML = StrToRepalce;

//4. RegEx with Special Character handling
StrToRepalce = "Scala is a Functional Programming Language. Scala is easy to learn.";
StrToRepalce = StrToRepalce.replace(new RegExp("Scala".replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'), "F#");
document.querySelector("#RegExSpecialCharacter").innerHTML = StrToRepalce;

//5. Adding replaceAll() to string prototype to use globally
String.prototype.replaceAll = function(find, replace) {
  var str = this;
  return str.replace(new RegExp(find.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'), replace);
};

var StrToRepalce = "Scala is a Functional Programming Language. Scala is easy to learn.";
StrToRepalce = StrToRepalce.replaceAll("Scala", "F#");
document.querySelector("#replaceAll").innerHTML = StrToRepalce;