This Is Not The Comma You Are Looking For

One reason for confusion is that there are lots of places where commas are just separators. 

For example, in object literals:

var obj={a:0,b:1,c:function(){}};

the commas are just separators. 

In arrays:

var arr=[1,2,3,4];

the commas are just separators.

Perhaps most confusing of all is the var declaration. For example in:

var a=1,b=2,c=3;

the commas are just separators, not comma operators.  The reason is that the var statement is a declaration and an initialization equivalent to

var a;
var b;
var c;
a=1;
b=2;
c=3;

Things like a=1 is an expression; the value of the expression is, in this case one. This allows you to write things like:

a=b=1;

which is equivalent to a=(b=1) 

However:

var a=1; 

isn't an expression and doesn't have a value. Rather, it contains an expression because initialization is of the form:

var variable=expression;

or 

var var1=exp1,var2=exp2 and so on...

This is subtle, but if you are following you can see that just by adding a pair of parentheses we can turn the previous var example into something that does use the comma operator:

var a=(1,b=2,c=3);

What do you think is stored in a, b and c? 

The answer is that a is 3, b is 2 and c is 3. The statement is of the form:

var a=expression;

and the expression is:

(1,b=2,c=3)

which, by the rules of the comma operator, evaluates each sub-expression in turn, throws away each of the results except for the last, which is the value of the expression. Notice that the b=2 and c=3 are expressions, and if b and c don't exist they are created as global variables. 

Now you should be able to see why:

var a=1,(b=2,c=3);

is nonsense and just generates an error, but 

var a=1,b=(2,c=3);

is perfectly OK and declares two local varlables a and b.

What is stored in b?

Answer 3 because the expression is (2,c=3).

Using The Comma

So now we have the comma mastered - what can you use it for?

The honest answer is not much. 

There are places, espcially in libraries, where you will find the comma operator in use, but in most cases there are much better and clearer ways of expressing the same idea. 

The most commonly encountered use of the comma operator is to make more complex for loops. Really for loops should be kept simple so the idea of making them more complex isn't a good one. JavaScript may be a jem but sometimes it is a very dangerous one.

A JavaScript for loop has the form:

for(expression1;expression2;experssion3)

Expression1 is evaluated once when the loop starts and it is usually where the initialization occurs. Expression2 is evaluated before each new iteration of the loop. If it evaluates to false the loop stops. Expression3 is evaluated at the end of each loop iteration and it is generally where loop counters etc are updated.

Notice that you can write any expression you care to in a for loop and you can use the comma operator so that you can write multple expressions. 

So, for example, what do you think the following for loop is all about?

for(var i=0,j=10;i<=j;i++,j--){
 console.log(i*j);
}

The first expression isn't a use of the comma operator. It just uses the var statement to create two local variables, i and j, and sets them to zero and ten respectively. The second expression is a simple test for i being less than or equal to j, and doesn't use the comma operator. The final expression is the only use of the comma operator and it adds one to i and subtracts one from j each time through the loop. So the values of i and j we create are:

0 10
1 9
2 8
3 7
4 6
5 5

and then the loop ends.

Clever?

You could just as easily have written the loop as:

for(var i=0,j=10;i<=j;i++){
 console.log(i*j);
 j--;
}

You can use a similar technique to turn a while loop into a sort of for loop:

var i=0;
while(i++,i<10){
 console.log(i)
}

There are lots of similar uses and examples, but they all come down to the same thing - we need to use a single expression but also need to evaluate some other expressions first just for their side effects. 

<ASIN:1871962579>

<ASIN:1871962560>

<ASIN:1871962501>

<ASIN:1871962528>