replace() in JavaScript

Learn via video course
FREE
View all courses
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
Topics Covered

Overview

The replace() in JavaScript is an inbuilt function that allows you to replace a part of the given string with another string/regular expression.

What is String replace() in Javascript?

JavaScript has a lot of useful in-built functions which includes replace(), splice(), unshift() and many more.

The replace in JavaScript is used to replace a particular string or regular expression with a new string. It returns a new string with the required modifications. The first parameter of replace() in JavaScript can be a string or a pattern to be matched within the given string, whereas the second parameter can be a new string or a function that will be invoked to create a new string. The original string stays unaffected.

If the first parameter is a string, then the replace function replaces only the first occurrence of that string.

Syntax of String replace() in Javascript

The syntax of replace() in Javascript is:

Where string is the name of a variable of string datatype.

Parameters of String replace() in Javascript

The replace() in JavaScript takes two parameters:

  • string/regular expression - is the string or pattern to be replaced
  • newString - is the new string that will replace the above string mentioned.

What is a regular expression?

A regular expression is a sequence of characters that specifies a pattern for searching in a string.

Return Value of String replace() in Javascript

Return Type: string

replace in JavaScipt returns a new string with the modification.

Example: Let's look at an example to understand replace() in JavaScript.

Output

The image below shows replace in JavaScript.

replacing nature in strings

Specifying a String as a Parameter

The code below shows two possible cases for the first parameter to be a string and a regular expression, whereas the second parameter is a string.

Example:

Output:

Explanation:

In the first case, the function replace in JavaScript searches for the first occurrence of the word correct and replaces the word with incorrect.

Note: It does not change the second word correct.

In the second case, it has a regular expression as the first parameter. This expression searches for the word change all over the string and replaces it with the new string.

Note: Both the words change has been replaced by keep.

There are several special replacement patterns that can be used with the replacement string:

PatternInserts
$$ It inserts a $.
$& It inserts the matched part of the string.
$`It inserts the portion of the string preceding the matched substring.
$'It inserts the portion of the string following the substring that matches.

Specifying a Function as a Parameter

It is not necessary to pass always a string as the second parameter. Instead, functions can be invoked to replace a particular string while using replace in JavaScript.

Example:

Output:

Explanation:

In the above example, the replace() in JavaScript takes the first parameter as a regular expression that searches for a digit within a given string and the second parameter calls for a function that returns a random number and replaces it.

The function takes the following arguments:

Possible argumentValue
matchThe substring that matched.
p1, p2, p3, ...If the first argument to replace() function is a RegExp object, it is the nth string found by a parenthesized capture group.
stringThe entire string is being examined.
offsetThe offset of the matched substring within the entire string is calculated.

More Examples

Example 1: Defining the Regular Expression in replace()

Output:

Explanation:

Notice how we mention the first parameter as a regular expression. The 'i' in the expression ignores the case sensitivity and searches for the pattern.

Example 2: Using Global and Ignore with replace()

Output:

Explanation:

In the above example case, global and ignore with replace() can only be done with regular expressions. It replaces each occurrence of the pattern mentioned irrespective of the case.

Note: The pattern has java in lowercase. In the example above, we replace all occurrences of Java with JavaScript.

Browser compatibility

The replace() method in javascript is supported by all the browsers such as Chrome, Edge, Safari, Opera, etc.

Conclusion

  • The replace() in JavaScript replaces a particular string or regular expression with a new string.
  • The function replace in Javascript does not modify the original string, it returns a new string.
  • It takes two parameters. The first parameter can be a string or a regex(regular expression). The second parameter can take a string or a function to be invoked.

See Also