What does split function look like?

Question

I came across this statement :

userName = document.cookie.split("=")[1];

after reading about split statement here at w3schools. which says that syntax of split is string.split(separator, limit). Then what does the square bracket after first parens. mean ? If this is true what does split function look like ?

Answer 1

String.split(separator, limit) returns an array. In Javascript, you can access array values by index using the square brackets. Arrays are zero-based, 0 is the first element, 1 the second and so on.

The equivalent of your code would be:

var arr = document.cookie.split("=");
userName = arr[1];

This separates the document.cookie by the equal-sign (=) and takes the second element (index 1) from it. document.cookie is a special property (datatype: String) of the document object which contains all cookies of a webpage, separated by the ; character. E.g. if document.cookie contains name=Adam, the array arr will contain the values name and Adam. The second one is stored in userName.

Note that if the cookie contains multiple values, or if the value contains multiple equal-signs, it won't work. Consider the next cases:

• document.cookie contains name=Adam; home=Nowhere. Using the above code, this would make userName contain Adam; home because the string is separated by the equal-sign, and then the second value is taken.
• document.cookie contains home=Nowhere; name=Adam. This would result in userName containing Nowhere; name
• document.cookie contains name=Adam=cool. In this case, userName would be Adam and not Adam=cool.

Also, w3schools is not that reliable. Use more authorative sources like the Mozilla Developer Network:

• document.cookie
• String.split
• Array

Answer 2

You shouldn't be using w3schools, but...

In JavaScript, function parameters are optional and it is possible to supply fewer parameters than the function expects. The extra parameters in the function are then undefined. Some functions are programmed to deal with that possibility and string.split is one of them.

The other part has to do with the fact that split returns an array. Arrays can then be indexed using the square bracket notation, hence the [1] after the function call.

Answer 3

Split would return an array e.g. [1, 2, 3]. If you supply the square bracket after it, it will return the specified key in the brackets, in this case userName would be 2

Answer 4

The square bracket in the code you supplied is accessing the second element of the array returned by split(). The function itself returns an array. That code would be the same as:

var temp = document.cookie.split("=");
userName = temp[1];

Answer 5

The split function returns an array of strings split by the given separator. With the square bracket you are accessing the nth element of that (returned) array.

If you are familiar with Java, its the same behavior as the String.split() method there.

Answer 6

split returns an array of strings. So square brackets mean get second string from the returned array.

Answer 7

It gets the second index of the resulting array

Same as:

var split = document.cookie.split("=");
var userName = split[1];