3 Ways to Replace All Spaces of a String in JavaScript

Replace all spaces in a String using replaceAll

If you want to replace spaces in a JavaScript string, you can use the replaceAll String method.

This function takes two parameters:

1. the first one is the pattern to match. It can be a string to match or a RegExp.
2. the second one is the replacement string.

After replacing all the occurrences of your string, the function returns a new string. It means that the initial string stays unchanged.

const myString = 'Hello how are you?'
const myStringWithoutSpaces = myString.replaceAll(' ', '') // Replace all spaces with ''

console.log(myStringWithoutSpaces)
// Output: "Hellohowareyou?"

Note: Be careful because some browsers do not support the replaceAll method. If you want to have a wide range of support, you can look at the replace usage in the next section of this article.

Replace all occurennces of a character in a string (replaceAll use-case in JS)

I like to share some use-cases in my articles to help you understand better what you can do with a function.

As an example, you have a post title with the following name: "replace all spaces of a string in js" (yes, that's the name of the article you're reading! 😁).

Our goal is to build a slug using the String method replaceAll in JavaScript. If you don't know what it is, a slug is the part of a URL that identifies a particular page on a website.

In our case, we want to have "replace-all-spaces-of-a-string-in-js".

const articleName = 'replace all spaces of a string in js'
const slug = articleName.replaceAll(' ', '-')

console.log(slug)
// Output: "replace-all-spaces-of-a-string-in-js"

Replace all spaces using replace with a global Regular Expressions

One well-known way of replacing all spaces in a string is using the replace String method.

This function takes two parameters and returns a new string as the replaceAll String method.

If you don't use a RegExp with a global flag as the pattern (first parameter), the replace function will only replace the first matching occurrence.

Here is an example with only the first occurrence replaced:

const myString = 'Hello how are you?'

// Replace all spaces matched by the RegExp to nothing ('')
const myStringWithoutSpaces = myString.replace(' ', '')

console.log(myStringWithoutSpaces)
// Output: "Hellohow are you?"

Now, if you want to replace all spaces in JS using replace, as mentioned before, you should use a RegExp with a global flag:

const myString = 'Hello how are you?'

// Be careful of using the global flag at the end of your RegExp ('g')
const whitespaceRegExp = / /g

// Replace all spaces matched by the RegExp to nothing ('')
const myStringWithoutSpaces = myString.replace(whitespaceRegExp, '')

console.log(myStringWithoutSpaces)
// Output: "Hellohowareyou?"

Replace all occurences in a string using split and join

Another way to remove all the occurrences of one character in a string is to convert it to an array using the split String method with a delimiter. Then, converting back to a string with the join Array method.

const myString = 'Hello how are you?'

// Convert to array using ' ' delimiter
const myStringToArray = myString.split(' ')

console.log(myStringToArray)
// Output: ["Hello", "how", "are", "you?"]

// Convert back the string to an array using no delimiters
const myStringWithoutSpaces = myStringToArray.join('')

console.log(myStringWithoutSpaces)
// Output: "Hellohowareyou?"