10

:) First of all, sorry my bady english :p I was taking a look to the next js code fragment:

var classes = element.className.split(/\s+/);

That code will split the full classname of and element into an array containing every class... but, what's the difference between using .split(/\s+/), and using .split(" ")? i see the same result...

I tested this with the next simple code in Chrome:

<!DOCTYPE html>
<html>
<body>
    <div id="cono" class="clase1 clase2 clase3-xD">
    </div>
    <script>
        var d = document.getElementById("cono");
        console.log(d.className);
        var classes = d.className.split(" ");
        for (i in classes) {
            console.log(classes[i]);
        }
    </script>
</body>
</html>

I have the same result whether i use .split(" ") or .split(/\s+/):

clase1 clase2 clase3-xD

clase1

clase2

clase3-xD

Do they have any relevant difference?

Improve this question
1
  • 1
    \s captures more whitespace than just the space character
    – anthony sottile
    Commented Jan 24, 2015 at 16:47

3 Answers 3

Reset to default
21

The difference between .split(" ") and .split(/\s+/) is:

The regex " "

  • Match the space character literally.

The regex /\s+/

  • Match a single whitespacecharacter (tab, line feed, carriage return, vertical tab, form feed) between one and unlimmited times. (greedy)

Short:

" "   splits the array at one single space character.
/\s/ splits the array at every kind of whitespace character
+      Matches between one and unlimitted times

Improve this answer
1
  • Thank you lol, you are my lifesaver for my project
    – IHZAQ
    Commented Dec 29, 2021 at 11:50
13

No, .split(/\s+/), and .split(" ") are different ones. \s+ matches one or more space characters including line breaks where " " matches a single horizontal space character. So .split(/\s+/) splits the input according to one or more space characters and .split(" ") splits the input according to a single space.

Example:

> "foo   bar".split(/\s+/)
[ 'foo', 'bar' ]
> "foo   bar".split(" ")
[ 'foo', '', '', 'bar' ]
Improve this answer
3
  • @Antony Sottile too Ohhh i get it... so \s+ will work fine even if the classes of the element were separated by more than one space... Thanks! :)
    – Just me
    Commented Jan 24, 2015 at 16:59
  • Ye but he answer the question too... so my thanks are for you and him ahah
    – Just me
    Commented Jan 24, 2015 at 17:01
  • @Justme accept an answer which helps you the most..
    – Avinash Raj
    Commented Jan 24, 2015 at 17:02
2

\s captures more types of whitespace than space

From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions:

Matches a single white space character, including space, tab, form feed, line feed. Equivalent to [ \f\n\r\t\v​\u00a0\u1680​\u180e\u2000​\u2001\u2002​\u2003\u2004​\u2005\u2006​\u2007\u2008​\u2009\u200a​\u2028\u2029​​\u202f\u205f​\u3000].

Also the + means it will match on multiple spaces. So foo bar will produce a different result:

js> 'foo      bar'.split(' ')
["foo", "", "", "", "", "", "bar"]
js> 'foo      bar'.split(/\s+/)
["foo", "bar"]
Improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.