JavaScript String replaceAll() Method

Previous
Quiz
Next

The JavaScript String replaceAll() method searches a value or a regex as a pattern and returns a new string where all occurrences of the pattern are replaced by a specified replacement.

The pattern can be either a string or a regular expression, and the replacement can be either a string or a function. The method does not change the original string, but returns a new string.

Following is the difference between the replace() and replaceAll() method −

The replace() method replaces only the first occurrence of a search value or a regex with a specified replacement, for example: ",tutorials,point,".replace(",", "") returns "tutorials,point,", whereas the replaceAll() method replaces all occurrences of a search value or a regex with a specified replacement.

Syntax

Following is the syntax of JavaScript String replaceAll() method −

replaceAll(pattern, replacement)

Parameters

This method accepts two parameters such as: 'pattern' and 'replacement', which are described below −

  • pattern − The string or a regular expression replace by the replament.
  • replacement − The string or function replaced the pattern.

Return value

This method, String.replaceAll(pattern, replacement), returns a new string with all matches of a pattern replaced by a replacement.

Example 1

In this program, we are using the JavaScript String replaceAll() method to replace a string "Point" with "point" in the string "Tutorials Point".

<html>
<head>
<title>JavaScript String replaceAll() Method</title>
</head>
<body>
<script>
   const str = "Tutorials Point";
   document.write("Original string: ", str);
   document.write("<br>New string after replace: ", str.replaceAll("Point", "point"));
</script>
</body>
</html>

Output

The above program returns "Tutorials point" after replacement −

Original string: Tutorials Point
New string after replace: Tutorials point

Example 2

Here is another example of the JavaScript String replaceAll() method. In this example, we use this method to replace all whitespace (" ") with an empty string ("") in the string " Hello World".

<html>
<head>
<title>JavaScript String replaceAll() Method</title>
</head>
<body>
<script>
   const str = " Hello World ";
   document.write("Original string: ", str);
   document.write("<br>New string after replace: ", str.replaceAll(" ", ""));
</script>
</body>
</html>

Output

After executing the above program, it returns a new string "HelloWorld" after replacement.

Original string: Hello World
New string after replace: HelloWorld

Example 3

If the pattern is an empty string, the replacement will be inserted in between every UTF-16 code(or between every character of words) unit. For example, the string "Hello" has five UTF-16 code units: H, e, l, l, and o. If you use replaceAll("", "_") on this string, you will get "_H_e_l_l_o_".

<html>
<head>
<title>JavaScript String replaceAll() Method</title>
</head>
<body>
<script>
   const str = "TutorialsPoint";
   document.write("Original string: ", str);
   document.write("<br>String after replcement: ", str.replaceAll("", "_"));
</script>
</body>
</html>

Output

Once the above program is executed, it returns "_T_u_t_o_r_i_a_l_s_P_o_i_n_t_".

Original string: Hello
String after replcement: _T_u_t_o_r_i_a_l_s_P_o_i_n_t_

Example 4

When the regular expression object does not have the global flag set, it throws a "TypeError" exception.

<html>
<head>
<title>JavaScript String replaceAll() Method</title>
</head>
<body>
<script>
   const str = "abbabba"
   document.write("Original string: ", str);
   try {
      document.write("<br>String after replacement: ", str.replaceAll(/b/, "-"));
   } catch (error) {
      document.write("<br>", error);
   }
</script>
</body>
</html>

Output

The above program throws a "TypeError" exception.

Original string: abbabba
TypeError: String.prototype.replaceAll called with a non-global RegExp argument
Print Page
Previous
Next
Advertisements