JavaScript Program to Replace Multiple Characters in a String

We are going to learn how we can replace Multiple Characters in a String. We have to replace multiple characters in a string using the inbuilt function or any other method.

Table of Content

  • Using replace() method
  • Using replaceAll() method
  • Using split() and join()
  • Using regular expression
  • Using reduce()
  • Using Map() Method

Using replace() method

In this approach, we are using the replace() method in which we replace multiple characters by calling and passing arguments in the replace() method multiple times. The original string will remain unchanged as we are storing changes into a new variable.

Example: It describes how we can replace multiple characters in a string using the replace() method

Javascript
// Original String
let str = 
    'Welcome w3wiki, Welcome Beginner';

// Replacing characters
let newString = 
    str.replace(/W/gi, 'w').replace(/G/gi, 'g');

// Printing the result
console.log(newString);

Output
welcome w3wiki, welcome Beginner

Using replaceAll() method

We are using replaceAll() method which takes two arguments. We are passing the character that need to be changed and the character that will take place instead of previous one, That’s how it will replace the character/string. It can also take regular expression and function as an argument.

Example: It describes how we can replace multiple characters in a string using the replaceAll() method

Javascript
// Original string
let str = 'gppkforgppks_ns_hele';

// Replacing multiple character
let result = str
    .replaceAll('p', 'e')
    .replaceAll('_', ' ')
    .replaceAll('n', 'i')
    .replaceAll('l', 'r');

// Printing the result
console.log(result);

Output
geekforBeginner is here

Using split() and join()

The split() and join() are two separate inbuild function of JavaScript, split() is used to split a string at particular place and join() is used to join that splited string into one with some argument passed during operation performance.

Example: It describes how we can replace multiple characters in a string using the split() and join() method

Javascript
// Original String
let str = 
    'ptlcomt GttksforGttks, ptlcomt gttks';

// Replacing character
let newString = 
    str.split('p').join('w').split('t').join('e');

// Printing the result
console.log(newString);

Output
welcome w3wiki, welcome Beginner

Using regular expression

In this approach we are using regular expression for checking presence of character in original string and replacing them using replace() method. Object.entries() is used for returning the array of charcter and replacemet ([key,value] pair) in “for each loop” for replacement of multiple character in one string.

Example: It describes how we can replace multiple characters in a string using regular expression

Javascript
// Given string
// which need to be changed
let str1 = "hilo geel for geels";

// Set of list which 
// need to be replaced 
// in given string
const set = {
    hilo: "Hello",
    geel: "geek",
    geels: "Beginner"
};

// Arrow function for
// replacments of character
let replaceMultiple = (str, set) => {
    const regx = 
        new RegExp(Object.keys(set).join("|"), "g");
    return str.replace(regx, (x) => set[x]);
}

// Calling arrow function
const result = replaceMultiple(str1, set);

// Printing the result in 
// the console
console.log(result);

Output
Hello geek for Beginner

Using reduce()

The reduce() method iterates over each character of the string, building a new string by checking if the character is in the list of characters to replace. If it is, the replacement character is added to the accumulator; otherwise, the original character is added.

Example: The replaceMultipleCharsReduce function replaces specified characters in a string with a given replacement using reduce(). It checks each character and builds the new string accordingly.

JavaScript
function replaceMultipleCharsReduce(str, charsToReplace, replacement) {
    return str.split('').reduce((acc, char) => 
        acc + (charsToReplace.includes(char) ? replacement : char), ''
    );
}

console.log(replaceMultipleCharsReduce("hello world", "eo", "*")); 

Output
h*ll* w*rld

Using Map for Replacement

In this approach, we utilize a map to specify the characters to be replaced and their corresponding replacements. We then iterate through the string, replacing each character according to the map. If a character is not found in the map, it remains unchanged.

Example: This demonstrates how we can replace multiple characters in a string using a map for replacement.

JavaScript
// Original String
let str = 'JavaScript is awesome';

// Map of characters to be replaced
const replaceMap = {
    'a': '4',
    'e': '3',
    's': '$',
    'o': '0'
};

// Function to replace characters using map
function replaceWithMap(str, replaceMap) {
    return str.split('').map(char => replaceMap[char] || char).join('');
}

// Replacing characters using map
let newString = replaceWithMap(str, replaceMap);

// Printing the result
console.log(newString);

Output
J4v4Script i$ 4w3$0m3