Tue Nov 16 2021·3 min read
Photo by Cody Board
To split a string with multiple separators, pass a regular expression to the
split() method. For example,
str.split(/[-_]+/) splits the string on all
occurrences of a hyphen or underscore. The
split method will split the string
on any match of the regular expression.
const str = 'a-b_c-d'; const split1 = str.split(/[-_]+/); console.log(split1); // 👉️ ['a', 'b' , 'c', 'd']
We passed a regular expression to the String.split method.
The forward slashes
/ / mark the beginning and end of the regular expression.
The square brackets are called a character class and match either one of the provided characters. In the example, we match a hyphen or an underscore.
+ matches the preceding item one or more times. In the example, it
matches a hyphen or an underscore one or more times.
const str = 'a.b c.d'; const split1 = str.split(/[.\s]+/); console.log(split1); // 👉️ ['a', 'b', 'c', 'd']
\s special character matches whitespace (spaces, tabs, newlines).
If you need a regex cheatsheet, check out this one from MDN. It's by far the best one out there.
You could also use a pipe
| (or) to simplify your regular expression, for
const str = 'a.b c.d'; const split2 = str.split(/\.|\s/); console.log(split2); // 👉️ ['a', 'b', 'c', 'd']
We used a pipe
| (or) symbol in our regular expression. Because a dot
. is a
special character, we had to escape it using a backslash.
This code snippet achieves the same result as the regex that used a character
If you're looking to avoid using regular expressions, you can use the String.replaceAll method.
To split a string with multiple separators, use the
replaceAll() method to
replace the separators with a single, unified character, and use the split
method on the string, passing it the new separator.
const str = 'one.two three.four'; const split4 = str.replaceAll('.', '$').replaceAll(' ', '$').split('$'); console.log(split4); // 👉️ ['one', 'two', 'three', 'four']
By replacing all occurrences of the multiple separators with the same character,
we get a string with a single separator, on which we can use the
without any regular expressions.
$doesn't matter in this example, it could be any character, e.g. a comma.
All we care about is unifying the separators into a single character, which we
can pass to the
Alternatively, you could chain calls to the
// ✅ split on each dot and space const str = 'a.b c.d'; const split3 = str.split('.').join('$').split(' ').join('$').split('$'); console.log(split3); // 👉️ ['a', 'b', 'c', 'd']
The first call to the
split method splits the string on each dot.
We then join the string with a dollar sign separator.
const str = 'a.b c.d'; // 👇️ "a$b c$d" console.log(str.split('.').join('$'));
The next step is to split by a space and join by a dollar sign again.
This is a two-step process:
I'm not a huge fan of using regular expressions, however in this scenario, I find the regex approach to be the most intuitive.
replaceAll method is also easy to read, but a bit more indirect and takes
a second to understand.
The only reason I've added the
split method approach is because the
replaceAll method is not supported in Internet Explorer, so the
join approach is an alternative, if you're looking to avoid regular