Replace a substring with String object in Javascript

Description

replace() method accepts two arguments.

• The first argument can be a RegExp object or a string.
• The second argument can be a string or a function.

If the first argument is a string, then only the first occurrence is replaced. To replace all instances of a substring, you have to provide a regular expression with the global flag.

Example

var text = "doom, room, loom"; 
        /*from ww w  .ja va 2s. co m*/
var result = text.replace("oo", "aa"); 
console.log(result); //daam, room, loom 
        
result = text.replace(/oo/g, "aa"); 
console.log(result); // daam, raam, laam

The code above generates the following result.

Replace with regular-expression

If the second argument is a string, there are several special character sequences that can be used to insert values from the regular-expression operations.

Using these special sequences allows replacement using information about the last match, such as in this example:

var text = "room, loom, doom"; 
result = text.replace(/(.oo)/g, "aa ($1)"); 
console.log(result); //aa (roo)m, aa (loo)m, aa (doo)m

The code above generates the following result.

Use $'

The following code shows the usage of $'.

var text = "room, loom, doom"; 
        /*from   w w  w .  j a  v  a 2s  . com*/
result = text.replace(/(.oo)/g, "aa ($')"); 
console.log(result); 
//aa (m, loom, doom)m, aa (m, doom)m, aa (m)m

The code above generates the following result.

Replace with a function

The second argument of replace() may be a function. When there is a single match, the function gets passed three arguments:

• the string match,
• the position of the match,
• and the whole string.

When there are multiple matches, the function gets passed three arguments:

• matched string
• the position of the match
• the original string.

The function returns a string indicating what the match should be replaced with.

function htmlEscape(text){ //  w ww  .  j ava 2s  . c o m
   return text.replace(/[<>"&]/g, function(match, pos, originalText){ 
       switch(match){ 
           case "<": 
              return "<mark>&lt;</mark>"; 
           case ">": 
              return "<mark>&gt;</mark>"; 
           case "&": 
              return "<mark>&amp;</mark>"; 
           case "\"": 
              return "<mark>&quot;</mark>"; 
       } 
   }); 
} 
console.log(htmlEscape("<p class='greeting'>Hello world!</p>")); 

The code above generates the following result.