How to Replace All Strings Occurrences in Javascript

Feb 3, 2024

2 mins read

Published in

A Comprehensive Guide to Replacing All String Occurrences in JavaScript**

String manipulation is a common task in JavaScript, and replacing all occurrences of a substring within a string is a frequent requirement. In this guide, we’ll explore different methods to achieve this, ensuring the code is effective and concise.

Method 1: Using split and join

One straightforward approach is to split the string into an array based on the target substring and then join it back with the desired replacement. Here’s the code:

1
2
3
4
5
6
7
8
function replaceAllOccurrences(inputString, target, replacement) {
    return inputString.split(target).join(replacement);
}

// Example usage:
const originalString = "Hello, world! Hello, universe!";
const modifiedString = replaceAllOccurrences(originalString, "Hello", "Hi");
console.log(modifiedString);

Method 2: Using Regular Expressions

Regular expressions provide a powerful way to handle string patterns. The global (g) flag ensures that all occurrences are replaced. Here’s an example:

1
2
3
4
5
6
7
8
9
function replaceAllOccurrencesRegex(inputString, target, replacement) {
    const regex = new RegExp(target, 'g');
    return inputString.replace(regex, replacement);
}

// Example usage:
const originalString = "Hello, world! Hello, universe!";
const modifiedString = replaceAllOccurrencesRegex(originalString, "Hello", "Hi");
console.log(modifiedString);

Method 3: Using split and join with Regular Expressions

Combining split, join, and regular expressions can be a concise and efficient solution:

1
2
3
4
5
6
7
8
9
function replaceAllOccurrencesRegexAndSplitJoin(inputString, target, replacement) {
    const regex = new RegExp(target, 'g');
    return inputString.split(regex).join(replacement);
}

// Example usage:
const originalString = "Hello, world! Hello, universe!";
const modifiedString = replaceAllOccurrencesRegexAndSplitJoin(originalString, "Hello", "Hi");
console.log(modifiedString);

In this guide, we’ve explored three methods to replace all occurrences of a substring within a string in JavaScript. Each method has its advantages, so choose the one that best suits your needs. String manipulation is a fundamental skill for JavaScript developers, and understanding these techniques will enhance your ability to work with textual data effectively.

Sharing is caring!