javascript regex split produces too many items

Question

I\'m trying to split a string using either commas or whitespace. A comma can optionally be preceded and/or followed by whitespace, and whitespace by itself also counts as a

Answer 1

If you simply remove the parentheses, it will work:

var s = 'a,b,c'
var answers = s.split(/\s*,\s*|\s+/);
// [ 'a', 'b', 'c' ]

Answer 2

With regexes the capture expression (x) remembers the match (and possibly returns that to the String.split). You should use the (non-capturing) grouping expression (?:x). See e.g. the Mozilla Docs on RegExp for more.

Answer 3

That's because split does also push capturing groups to the result array:

If separator is a regular expression that contains capturing parentheses, then each time separator is matched the results (including any undefined results) of the capturing parentheses are spliced into the output array.

The space between a and b was matched by the whitespace, so the capturing group was undefined. The comma between b and c was matched by the group, so it became the fourth item of your array.

To solve the issue, just remove the capturing group:

var answers = s.split(/\s*,\s*|\s+/);

If you had a more complex expression where you needed grouping, you could make it non-capturing like this:

var answers = s.split(/(?:\s*,\s*)|\s+/);

Answer 4

The content of capturing groups are added to the result array. From the MDN documentation:

If separator is a regular expression that contains capturing parentheses, then each time separator is matched the results (including any undefined results) of the capturing parentheses are spliced into the output array. However, not all browsers support this capability.

Use non-capturing groups:

/(?:\s*,\s*)|\s+/