Replace all Backslashes in a String using JavaScript

avatar

Borislav Hadzhiev

Tue Oct 12 20213 min read

banner

Photo by Ian Schneider

Replace all Backslashes in a String #

To replace all backslashes in a string:

  1. Call the replaceAll() method, passing it a string containing two backslashes as the first parameter and the replacement string as the second.
  2. The replaceAll method will return a new string with all backslashes replaced by the provided replacement.
index.js
const str = 'a\\b\\c'; const replaced = str.replaceAll('\\', '|'); console.log(replaced); // ๐Ÿ‘‰๏ธ a|b|c

We passed the following parameters to the String.replaceAll method:

  1. a substring we want to match in the string. Notice that we have to escape the backslash character with another backslash.
  2. a replacement for each match. In the example we use a pipe symbol as the replacement.

In the example we replace each backslash with a pipe, however you can provide any replacement string that suits your use case, e.g. a hyphen:

index.js
const str = 'a\\b\\c'; const replaced = str.replaceAll('\\', '-'); console.log(replaced); // ๐Ÿ‘‰๏ธ a-b-c

The replaceAll method does not mutate the original string, it returns a new string with all matches replaced. Strings are immutable in JavaScript.

The replaceAll method is not supported in Internet Explorer versions 6-11. If you need to support the browser, use the replace method instead.

To replace all backslashes in a string:

  1. Call the replace() method, passing it a regular expression that matches all backslashes as the first parameter and the replacement string as the second.
  2. The replace method will return a new string with all backslashes replaced.
index.js
// Supported in IE 6-11 const str = 'a\\b\\c'; const replaced = str.replace(/\\/g, '_'); console.log(replaced); // ๐Ÿ‘‰๏ธ a_b_c

We passed the following parameters to the String.replace method:

  1. a regular expression that matches all backslashes in the string. Again, we have to escape the backslash character with another backslash.
  2. a replacement string for each match. In the example we provided an underscore as the replacement

The regular expression is quite hard to read and would take a second even for a seasoned developer.

If you ever need help reading a regular expression, check out this regex cheatsheet from the MDN docs.

We use the g (global) flag, because we want to match all backslashes in the string and not just the first occurrence.

The replace method does not change the original string, it returns a new string with one or more matches replaced.

The regular expression is quite difficult to read, so here's an alternative approach, which also is supported by Internet Explorer.

To replace all backslashes in a string:

  1. Call the split() method on the string, passing it a string containing two backslashes.
  2. The split method will return an array containing the divided substrings.
  3. Call the join() method on the array, passing it the replacement string.
  4. The join method returns a new string by concatenating the array elements with the provided separator.
index.js
const str = 'a\\b\\c'; const replaced = str.split('\\').join('-'); console.log(replaced); // ๐Ÿ‘‰๏ธ a-b-c

The String.split method returns an array containing the substrings, split on the backslashes.

index.js
const str = 'a\\b\\c'; const split = str.split('\\') console.log(split) // ๐Ÿ‘‰๏ธ ['a', 'b', 'c']

The last step is to use the Array.join method to join the array elements with a provided separator.

In the example we use a dash, however you can use any string that suits your use case.

The replaceAll method is my preferred solution for this problem, because it's quite easier to read than the other 2 approaches. However, if you need to support Internet Explorer the other methods get the job done.

Join my newsletter

I'll send you 1 email a week with links to all of the articles I've written that week

Buy Me A Coffee