JavaScript - Initialization of a variable from two literal/variables

Question

Please consider the below cases:

Case 1: Initialization of a variable, with a literal and a variable, which I have never declared or initialised before.

var x = 10, i;

When, I print the value of x, it prints 10. I am wondering, how is this even syntactically correct? It is something unexpected. Is it a bug?

Case 2: Initialization of a variable, with a variable and literal, which I have declared or initialised before.

var i = 10;
var x = i, 10;

Then, I tried with the above, thinking that, if CASE 1 can work, then the above should also work. But, I was surprised, it didn't work. Instead it gave an error: Uncaught SyntaxError: Unexpected number.

CASE 3: Initialization of a variable, with two literals.

var x = 10, 10;

I tried with above, but it game me the same error: Uncaught SyntaxError: Unexpected number. Now I am very confused.

CASE 4: Initialization of a variable, with two variables, which I have declared or initialised before.

var i = 10;
var j = 20
var x = i, j;

The above case gave me expected results, i.e. 10.

But, after all the above cases, why even at the first place, JavaScript is syntactically allowing to do like that? That too, with a variable, which I have never declared before? I am very much confused. Is there something wrong, like a bug? Or is there any explanation for this?

Note:

All the above cases are tried in Chrome's console, as well as in VS Code also.
Results are same, when I tried with TypeScript.

Side note: 10 isn't a constant, it's a literal. (Granted, literals have constant values...) — T.J. Crowder
– T.J. Crowder, Commented May 16, 2020 at 14:40
@Dexygen, it gives an error: Uncaught SyntaxError: Identifier 'j' has already been declared. Thanks for letting me know. — ngShravil.py
– ngShravil.py, Commented May 16, 2020 at 14:52

T.J. Crowder · Accepted Answer · 2020-05-16 14:49:57Z

5

Your confusion stems from a misunderstanding:

Case 1: Initialization of a variable, with a constant and a variable, which I have never declared or initialised before.
var x = 10, i;

That isn't what that code does. In a var statement, the comma isn't the comma operator,¹ it's a separator between variables you're declaring. Your code there is exactly equivalent to:

var x = 10;
var i;

Case 2...

Case 3...

Case 2 and Case 3 give you an error because 10 isn't a valid variable name, but that's what the var statement expects after a comma.

CASE 4: Initialization of a variable, with two variables, which I have declared or initialised before.
var i = 10;
var j = 20
var x = i, j;
The above case gave me expected results, i.e. 10.

...but not for the reason you think. The reason that works is that you're allowed to redeclare variables with var as many times as you like. The code above is exactly equivalent to:

var i = 10;
var j = 20
var x = i;
var j;

The redeclaration of j has no effect, it's just completely ignored. (That wouldn't be true with the newer let or const, they give you a declaration error if you try to redeclare a variable.)

If var x = i, j were using the comma operator, the expected result would be that x had 20, not 10 (see below for details).

¹ "...isn't the comma operator..." In expressions, , is an operator in JavaScript, but unless you group things together with () that isn't what , means in variable declarations (or array or object literals, function parameter lists, or function argument lists). But just for completeness:

var a;
a = 1, 3;

...uses the comma operator, which is one of JavaScript's odder operators: It evaluates its left-hand operand, throws away the result value, and then evaluates its right-hand operand and takes that result value as its result. So with the above, a is initialized with the value 3. The left-hand operand in a comma operator expression is only useful for side-effects. (In general, using the comma operator tends to lead to unclear code, so it's best avoided.)

edited May 16, 2020 at 14:49

answered May 16, 2020 at 14:42

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

ngShravil.py Over a year ago

When I try with let, it gives me an error, Uncaught SyntaxError: Identifier 'j' has already been declared, thanks for letting me know.

T.J. Crowder Over a year ago

@ngShravil.py - Yup, exactly. ("That wouldn't be true with the newer let or const, they give you a declaration error if you try to redeclare a variable.")

ngShravil.py Over a year ago

This is a solid answer. Now all my doubts related to this have disappeared. Thanks a lot!

Collectives™ on Stack Overflow

JavaScript - Initialization of a variable from two literal/variables

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related