Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How to replace string using JavaScript RegExp?
In this tutorial, we will explore how to replace a particular substring in a string using regular expressions in JavaScript. Sometimes we may want to replace a recurring substring in a string with something else. In such cases, regular expressions can be beneficial.
Regular expressions are basically a pattern of characters that can be used to search different occurrences of that pattern in a string. Regular expressions make it possible to search for a particular pattern in a stream of characters and replace it easily. For example, consider the regular expression /ab*c/ which denotes that we are looking for a pattern where we have one 'a', followed by 0 or more 'b' characters followed by one 'c'.
JavaScript has an in-built method for the string data type called the replace() method. Using this function we can replace the occurrences of a particular pattern in a string with whatever we want and we can use regular expressions to denote this pattern.
Syntax
The syntax of the replace() function is:
string.replace(pattern, replacement)
Parameters
-
pattern ? This refers to the substring of the string which is to be replaced. This parameter can be a string or a regular expression that denotes the pattern to be found and replaced. Only the first occurrence of the pattern will be replaced, but if a regular expression is provided with the global modifier 'g', all matches will be replaced.
-
replacement ? This denotes the string which will take the place of the pattern. This parameter can also be a function that returns the string which will be used as a replacement for each occurrence of pattern.
Example 1: Without the Global Modifier 'g'
In this example, we replace a string using the replace() method without the global modifier 'g'.
<!DOCTYPE html>
<html>
<body>
<script>
var st = "She sells sea shells on the seashore";
document.write("Original string : " + st);
var regExp = /sea/i;
var modifiedSt = st.replace(regExp, "river");
document.write("<br>Modified string : " + modifiedSt);
</script>
</body>
</html>
Original string : She sells sea shells on the seashore Modified string : She sells river shells on the seashore
In the above code, we used the regular expression with only the 'i' modifier (case-insensitive) and it only changed the first occurrence of "sea" to "river", not the "sea" in "seashore".
Example 2: With the Global Modifier 'g'
In this example, we replace a string using the replace() method with the global modifier 'g'.
<!DOCTYPE html>
<html>
<body>
<script>
var st = "She sells sea shells on the seashore";
document.write("Original string : " + st);
var regExp = /sea/ig;
var modifiedSt = st.replace(regExp, "river");
document.write("<br>Modified string : " + modifiedSt);
</script>
</body>
</html>
Original string : She sells sea shells on the seashore Modified string : She sells river shells on the rivershore
In this code, we used the regular expression with both 'i' (case-insensitive) and 'g' (global) modifiers. Notice that "seashore" was changed to "rivershore" because the global modifier replaced all occurrences of "sea".
Common RegExp Flags
Here are the most commonly used regular expression flags:
- i - Case-insensitive matching
- g - Global matching (find all matches, not just the first)
- m - Multi-line matching
Conclusion
The replace() method with regular expressions is a powerful tool for string manipulation in JavaScript. Use the global modifier 'g' to replace all occurrences, and combine it with other flags like 'i' for case-insensitive matching to create flexible pattern matching solutions.
3K+ Views
