Multiple variable declaration in Javascript

Asked

Viewed 3,368 times

7

It has become quite common to declare variables in multiple lines in Javascript. Especially when they are initialized later:

var var1 = null,
    var2 = null,
    var3 = 0;

The "normal" would be like this:

var var1 = null;
var var2 = null;
var var3 = 0;
  • Why multiple declaration of variables on multiple lines has become so common?
  • What are the differences between the two?
  • When I should wear one or the other?
  • I’m not a big fan of separating variables with a comma because that makes the first and last lines different from the middle lines. That means we need to edit the line of var3 if we want to add a var4 on the list. That said, some people find the first version more beautiful.

  • Just to show how it’s more a matter of taste anyway, unlike @hugomg I already prefer to use with commas, so when you need to set several empty variables at the beginning of a function, you can do everything in one line saving characters.

2 answers

8


It’s mostly a matter of style, a matter of taste.
There is no difference of operation between one and the other.

The only advantage of declaring with commas is to save a few Bites for not needing to use var so many times and so make the script slightly smaller. To spare such Bites should do it inline, in the same line as the @hugomg also pointed out).

  • 3

    The script only gets smaller if the comma-separated statements are all on the same line - if you have everything indented with spaces like in the OP case then the number of bytes is the same. That said, any good Javascript minificator already does this trick (and more) without you having to change your style in the source code.

  • @hugomg true, I assumed this but it is better to leave in the reply to those who do not think of it naturally. Thank you.

  • I thought I might have some problem with maintenance or possibility of errors.. but apparently it’s just bytes. Searching the internet, I found that if you forget a comma in the multiline, the next var will be global. But using the 'use strict', the error is charged..

5

There are many arguments in favor of both sides ranging from automatic semicolon insertion, Hoisting and readability until "this is easier to do diff than that".

In the end it all comes down to Choose what’s best for you.

There is, however, an objective criterion that can make you choose to declare a single var, which is the performance. Indeed, the performance of the declaration of a single var is higher than the multiple declaration var as indicated by the following tests:

It may be a small and irrelevant difference, but it is the only criterion that goes beyond subjectivity.

  • 1

    Like the hoisting enters into this story?

  • The arguments are not very clear. The arguments I found are of the type : "A single var statement makes it easier to avoid Hoisting confusions that can occur when declaring vars in Blocks." This is a phrase spoken by Douglas Crockford, creator of JSON and Jslint at the following link: https://plus.google.com/+RonWaldon/posts/8kgP8EU56LS

  • I will try later to list the arguments that exist for both sides

  • 1

    I don’t know if these porformance tests are as reliable. You’ll spend a lot more time measuring time than running the statements. In addition, the two ways of declaring the variables should generate momesmo bytecode after compiled.

  • The jsfiddle example shows a much bigger difference by an error in the code, you used the singleVarStart instead of the multiVarsStart on line 41 and so it gives a much higher value

Browser other questions tagged

You are not signed in. Login or sign up in order to post.