How to use replaceAll() with regex JavaScript? [SOLVED]


Olorunfemi Akinlua

JavaScript

Introduction

Replacement or substitution is a process that we might often do especially with Strings. Though strings are immutable, we can create copies of the string with certain portions of it replaced with new values.

JavaScript provides an instance method called the replaceAll method which allows us to match patterns within a string and returns a new string with the replacement.

If you need to perform a replacement based on a regular expression (regex), you can use the string replaceAll() method. This method is available on all strings in JavaScript.

 

Using the replaceAll() method

The replaceAll() method accepts two arguments. The first argument is the string or regex to match (pattern). The second argument is the replacement. The replacement can be a string or a function.

If you pass a string as the second argument, all matches will be replaced with that string. If you pass a function, the function will be called for each match. The function should return the replacement string.

 

Using string as a pattern

Here are some examples of using the replaceAll() method where the first argument is a string

let str = "Hello world!";

// Replace all occurrences of 'Hello' with 'Goodbye'
str = str.replaceAll("Hello", "Goodbye");
console.log(str);

// Replace all occurrences of 'world' with 'Earth'
str = str.replaceAll("world", "Earth");
console.log(str);

// Replace all occurrences of '!' with '?'
str = str.replaceAll("!", "?");
console.log(str);

Output

Goodbye world!
Goodbye Earth!
Goodbye Earth?

 

Using regex as a pattern

We can make use of regular expressions to define the pattern we want to replace with the replacement string. Here are some examples of using the replaceAll() method where the first argument is a regex pattern

let str =
    "Hello World! Welcome to my world. This is command post 234, area Clex.";

// Replace all occurrences of 'Hello' with 'Goodbye'
str = str.replaceAll(/world/g, "abode");
console.log(str);

// Replace all number occurrences with X
str = str.replaceAll(/\\d/g, "X");
console.log(str);

// Replace all a b c occurences with ?
str = str.replaceAll(/[abc]/g, "?");
console.log(str);

Output

Hello World! Welcome to my abode. This is command post 234, area Clex.
Hello World! Welcome to my abode. This is command post XXX, area Clex.
Hello World! Wel?ome to my ??ode. This is ?omm?nd post XXX, ?re? Clex.

 

Using function as the replacement string

We can replace the pattern we intend based on the value of a function as long as the function value is a string. Therefore, for every string or pattern match, we call the function on it. Here is an example of using a function as the replacement.

let str =
    "Hello World! Welcome to my world. This is command post 234, area Clex.";

// Replace all number occurences with different values
// based on the anonymous function
str = str.replaceAll(/\\d/g, (a) => {
    if (a == 2) {
        return "two";
    } else if (a == 3) {
        return "three";
    } else {
        return "num";
    }
});

console.log(str);

Output

Hello World! Welcome to my world. This is command post twothreenum, area Clex.

As you can see the values 2 and 3 have been replaced by two and three and 4 was replaced by num.

 

Summary

The replaceAll() method can use both string or regex to replace parts or portions of a string with a replacement where the replacement can be a string or a function. The function will be called upon every match and must return a string.

 

References

String.prototype.replaceAll() - JavaScript | MDN (mozilla.org)

 

Views: 11

Olorunfemi Akinlua

He is boasting over five years of experience in JavaScript, specializing in technical content writing and UX design. With a keen focus on programming languages, he crafts compelling content and designs user-friendly interfaces to enhance digital experiences across various domains. You can connect with him on LinkedIn.

Can't find what you're searching for? Let us assist you.

Enter your query below, and we'll provide instant results tailored to your needs.

If my articles on GoLinuxCloud has helped you, kindly consider buying me a coffee as a token of appreciation.

Buy GoLinuxCloud a Coffee

For any other feedbacks or questions you can send mail to admin@golinuxcloud.com

Thank You for your support!!

Leave a Comment


We try to offer easy-to-follow guides and tips on various topics such as Linux, Cloud Computing, Programming Languages, Ethical Hacking and much more.

Programming Languages

JavaScript

Python

Golang

Node.js

Java

Laravel