3 ways in JavaScript to remove all hyphens from a string

How to remove hyphens from a string in JavaScript:

In this post, we will learn how to remove all hyphens from a string in JavaScript. It is a common problem you will face in both frontend and backend. Before processing a string, you can use this method to remove all hyphens or dashes (-).

For example, if you are getting a serial number as 123-234-980-910, and if you want to store it by removing the dashes, you can use any of these methods I am showing in this post.

There are different ways we can use in JavaScript to remove hyphens from a string. Let’s learn all of these methods one by one.

Method 1: By using replace():

The replace() method is an inbuilt method to replace all occurrences of a given pattern with a different replacement string. We can pass a regular expression or a string as the pattern for replace() and another string as the replacement string.

It doesn’t make any change to the original string. It creates a new string and returns that string.

Definition of replace:

The definition of replace is defined as like below:

replace(regex, sub)
replace(subStr, fn)

Here,

regex is a regular expression.
sub is the string to replace with all matches of the regular expression.
subStr is a sub-string we want to replace with the new string.
fn is a function to invoke to create the new substring that will replace the matches.

It returns a new string, i.e. by replacing the matches by the replacement string.

How to use replace() to remove all hyphens:

We can use replace() method to remove all hyphens if we pass a regular expression that matched all hyphens and it will replace it with a blank space.

We can’t pass a string as the first parameter because it will replace the new string only for the first occurrence of the first parameter.

Below is the complete program:

const givenStr = '123-hello-world';

const str = givenStr.replace(/-/g, '');

console.log(str);

Here, /-/g is the regular expression we are using. It will match all - in the given string.

It will print:

123helloworld

As you can see here, it removes all hyphens from the string.

Method 2: By using replaceAll():

The replaceAll method replaces all matches of a regular expression or string with another string and returns a new string. We can use this method instead of replace() and pass - as the first parameter.

This method also doesn’t modify the original string and creates a new string.

Definition of replaceAll:

replaceAll is defined as like below:

replace(regex, sub)
replace(subStr, fn)

Here,

regex is a regular expression.
sub is the string to replace with all matches of the regular expression.
subStr is a substring we want to replace with the new string.
fn is a function to invoke to create the new substring that will replace the matches.

How to use replaceAll() to remove all hyphens:

Let’s use replaceAll() to remove all hyphens:

const givenStr = '123-hello-world';

const str = givenStr.replaceAll('-', '');

console.log(str);

It will remove all hyphens and it will print the same output.

123helloworld

Method 3: By using split() and join():

This is another way to do this. I don’t recommend you to use this approach as it runs on two iterations. The split method will split the strings in - and it will return an array holding all the words separated by a comma. The join() method will join all words and it will create a new string.

While calling split, we will pass hyphen, ’-’ as its parameter. It will break the strings at all hyphens.

By default, the join method joins all words using a comma. We will pass an empty string to this method to join the words without any separator.

These two methods will also create a new string.

const givenStr = '123-hello-world';

const str = givenStr.split('-').join('');

console.log(str);

This method will also print the same result:

123helloworld

Combining all three ways:

Let’s write down all of these methods in one program:

const givenStr = '123-hello-world';

const str1 = givenStr.replace(/-/g, '');
const str2 = givenStr.replaceAll('-', '');
const str3 = givenStr.split('-').join('');

console.log(str1);
console.log(str2);
console.log(str3);