How to Split a String by a Regex in JavaScript

# Split a String by a Regex in JavaScript

Pass a regular expression as a parameter to the String.split() method to split a string by a regex.

The split method takes a string or regular expression and splits the string based on the provided separator, into an array of substrings.

Copied!
const str = 'one,two.three four';

const result = str.split(/[,.\s]/);

// 👇️ ['one', 'two', 'three', 'four']
console.log(result);

The String.split() method takes a separator and splits the string into an array on each occurrence of the provided delimiter.

The String.split() method takes the following 2 parameters:

The only argument we passed to the split() method is a regular expression.

The method splits the string into an array of substrings on each match of the regular expression.

Copied!
const str = 'one,two.three four';

const result = str.split(/[,.\s]/);

// 👇️ ['one', 'two', 'three', 'four']
console.log(result);

The forward slashes / / mark the beginning and end of the regular expression.

The regular expression in the example uses a character class [] to match any of the characters between the square brackets - a comma, a dot, and a whitespace.

# Examples of splitting strings by a regex

Here's another example that splits a string on each digit.

Copied!
const str = 'bobby1hadz2com';

const result = str.split(/\d/);
console.log(result); // 👉️ [ 'bobby', 'hadz', 'com' ]

The \d special character matches any digit 0-9. It's the same as using a range [0-9].

# Performing a case-insensitive match and split

However, you could use other flags. For example, you can use the i flag for a case-insensitive match.

Copied!
const str = 'oneAtwoBthree';

const result = str.split(/[ab]/i);
console.log(result); // 👉️ ['one', 'two', 'three']

The character class [] matches either a or b.

We set the i flag, so we match uppercase and lowercase occurrences of the a and b characters in the string.

If you ever need help reading a regular expression, check out this regular expression cheat sheet by MDN.

It contains a table with the name and the meaning of each special character with examples.

# Removing empty strings from the result

If you have leading or trailing matches or multiple matches next to one another, you might get empty string elements in the result.

Copied!
const str = 'one,,two..three four.';

const result = str.split(/[,.\s]/);

// 👇️ [ 'one', '', 'two', '', 'three', 'four', '' ]
console.log(result);

You can use the Array.filter() method to remove the empty strings from the array.

Copied!
const str = 'one,,two..three four.';

const result = str.split(/[,.\s]/).filter(element => element);

// 👇️ [ 'one', 'two', 'three', 'four' ]
console.log(result);

The function we passed to the Array.filter() method gets called with each element in the array.

The filter() method returns a new array that only contains the elements that meet the condition.

On each iteration, we return the string as is to filter out all falsy values (empty strings) from the array.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• Split a String on Capital Letters using JavaScript
• Split a String and get First or Last Array Element in JS
• Split on the Last Occurrence of a String in JavaScript
• Split a Number into an Array in JavaScript
• Split a String removing any Empty Elements in JavaScript
• Split a String at a specific Index using JavaScript
• How to Split a String by Newline in JavaScript
• Split a String with multiple Separators using JavaScript
• How to Split a string by Spaces in JavaScript
• Split a String only on the First Occurrence of a Character
• Split a String by Special Characters in JavaScript
• Split a String every N characters in JavaScript
• SyntaxError: Invalid regular expression, Nothing to repeat