Out of the different “Data Types” in JavaScript, String has been one of my favorites. It is also one of the most widely used Data Type. It would not be an understatement to say that most of our programming activities revolve around some kind of string. Many times you would come across scenarios in JavaScript to replace all occurrences of a string. In JavaScript, there are various native built-in string related methods however there is no JavaScript replace all method predefined. Instead, String.replace() is a very common method that most of us would have used. Let us take a look at it.
The syntax of String.replace() is :
/* where 'string' is your string object or a string */
string.replace(searchvalue,newvalue);In the syntax above, the “string” refers to the String object that you want to execute the “replace” method on, “searchvalue” refers to the word / character that you want to look for and replace within the string, and the “newvalue” refers to the new word/character that you want to replace the “searchvalue” with.
Let’s look at an example of the default behaviour :
var str = "John is happy today as john won the match today";
/* Let's replace "John" with "He".
However, Please note that this is the default behavior and not the actual solution! */
str = str.replace('John','He');
/* str becomes:
He is happy today as john won the match today. */However, if you notice the second occurrence of “john” was not replaced. That is exactly what the replace method does. It by default replaces only the first occurrence of the string to be replaced or the search string.
Then, How do we search and replace all the occurrences of a string in JavaScript? Is there a JavaScript replace all method? – Resolved !
Well, there isn’t any JavaScript replace all method available out of the box but a JavaScript replace all regex is available. To search and replace all the occurrences of a string in JavaScript using the string.replace() method, you’ll have to pass the search string as a regular expression. For example :
The Answer !!
var str = "John is happy today as john won the match today. John made 100 runs.";
// Let's replace "John" with "He".
str = str.replace(/John/g,'He');
/* str becomes:
He is happy today as john won the match today. He made 100 runs.
To make the search case-insensitive pass the "i" parameter
in regular expression. */
str = str.replace(/John/gi,'He');
/* Now str becomes :
He is happy today as He won the match today. He made 100 runs. */Also since the search is case sensitive, we had to pass the “i” parameter in the regular expression along with the “g” parameter to make the search case-insensitive. You may consider reading more about regular expressions, they are extremely useful.
jQuery string replace all
Even in jQuery we can replace all string or text using the same method. All you need to do is to access the string value using one of the jQuery Selectors and run it through the regex mentioned in the example above.
Typescript Replace all occurrences of a string
Even in Typescript, the concept essentially remains the same as that of JavaScript. Since Typescript too has the JavaScript methods available, you can use the same replace() method.
let myStr = "John is happy today as john won the match today. John made 100 runs.";
myStr = myStr.replace(/John/gi, 'Tom');
/* makes myStr as "Tom is happy today as Tom won the match today. Tom made 100 runs. */You may use the above-mentioned method to do replace all spaces in string in Javascript, replace all quotes in Javascript, or to replace all dots/periods in JavaScript string too. Also, you may use the same method to do a JavaScript replace all occurrences of a string in jquery or to try a JavaScript replace all commas. Please remember to use the JavaScript replace all regex to match and replace as per your requirement. Hope you liked our article on JavaScript Replace all occurrences.