Javascript How to define multiple variables on a single line?

Javascript

Javascript Problem Overview


Reading documentation online, I'm getting confused how to properly define multiple JavaScript variables on a single line.

If I want to condense the following code, what's the proper JavaScript "strict" way to define multiple javascript variables on a single line?

var a = 0;
var b = 0;

Is it:

var a = b = 0;

or

var a = var b = 0; 

etc...

Javascript Solutions


Solution 1 - Javascript

Using Javascript's es6 or node, you can do the following:

var [a,b,c,d] = [0,1,2,3]

And if you want to easily print multiple variables in a single line, just do this:

console.log(a, b, c, d)

>0 1 2 3

This is similar to @alex gray 's answer here, but this example is in Javascript instead of CoffeeScript.

Note that this uses Javascript's array destructuring assignment

Solution 2 - Javascript

You want to rely on commas because if you rely on the multiple assignment construct, you'll shoot yourself in the foot at one point or another.

An example would be:

>>> var a = b = c = [];
>>> c.push(1)
[1]
>>> a
[1]

They all refer to the same object in memory, they are not "unique" since anytime you make a reference to an object ( array, object literal, function ) it's passed by reference and not value. So if you change just one of those variables, and wanted them to act individually you will not get what you want because they are not individual objects.

There is also a downside in multiple assignment, in that the secondary variables become globals, and you don't want to leak into the global namespace.

(function() {  var a = global = 5 })();
alert(window.global) // 5

It's best to just use commas and preferably with lots of whitespace so it's readable:

var a = 5
  , b = 2
  , c = 3
  , d = {}
  , e = [];

Solution 3 - Javascript

There is no way to do it in one line with assignment as value.

var a = b = 0;

makes b global. A correct way (without leaking variables) is the slightly longer:

var a = 0, b = a;

which is useful in the case:

var a = <someLargeExpressionHere>, b = a, c = a, d = a;

Solution 4 - Javascript

Why not doing it in two lines?

var a, b, c, d;    // All in the same scope
a = b = c = d = 1; // Set value to all.

The reason why, is to preserve the local scope on variable declarations, as this:

var a = b = c = d = 1;

will lead to the implicit declarations of b, c and d on the window scope.

Solution 5 - Javascript

Here is the new ES6 method of declaration multiple variables in one line:

const person = { name: 'Prince', age: 22, id: 1 };

let {name, age, id} = person;

console.log(name);
console.log(age);
console.log(id);

* Your variable name and object index need be same

Solution 6 - Javascript

Specifically to what the OP has asked, if you want to initialize N variables with the same value (e.g. 0), you can use array destructuring and Array.fill to assign to the variables an array of N 0s:

let [a, b, c, d] = Array(4).fill(0);

console.log(a, b, c, d);

Solution 7 - Javascript

note you can only do this with Numbers and Strings

you could do...

var a, b, c; a = b = c = 0; //but why?

c++;
// c = 1, b = 0, a = 0;

Solution 8 - Javascript

do this if they have same value

let x = y = z = 0

otherwise

let [x, y, z] = [10, 30, 50]
console.log(x, y, z) // 10 30 50

Solution 9 - Javascript

The compressed type of that is here:

var a, b = a = "Hi";

& for 3 variables:

var x, y, z = x = y = "Hello";

Hope to be helpful!

Solution 10 - Javascript

This is completely correct:

var str1 = str2 = str3 = "value";

And if change one of their value, the value of other variables won't change:

var str1 = str2 = str3 = "value";

/* Changing value of str2 */
str2 = "Hi Web!";

document.write("str1 = " + str1 + " - str2 = " + str2 + " - str3 = " + str3);

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionHeatherKView Question on Stackoverflow
Solution 1 - JavascriptmodulitosView Answer on Stackoverflow
Solution 2 - Javascriptmeder omuralievView Answer on Stackoverflow
Solution 3 - JavascriptMatthew FlaschenView Answer on Stackoverflow
Solution 4 - JavascriptNick LouloudakisView Answer on Stackoverflow
Solution 5 - JavascriptPrince AhmedView Answer on Stackoverflow
Solution 6 - JavascriptDan DascalescuView Answer on Stackoverflow
Solution 7 - JavascriptPDAView Answer on Stackoverflow
Solution 8 - JavascriptYassBanView Answer on Stackoverflow
Solution 9 - JavascriptPartoyeMehrView Answer on Stackoverflow
Solution 10 - JavascriptCHPView Answer on Stackoverflow