What is the advantage of initializing multiple javascript variables with the same var keyword?

When I read javascript code that is clean and written by people who are obviously very good at it, I often see this pattern

var x = some.initialization.method(),
    y = something.els(),
    z;

What is the advantage of that over writing

var x = some.initialization.method();
var y = something.els();
var z;

The second format is easier to maintain, since each line exists by itself. So you can erase a line or add a line, and not have to look around to see if it's the first or last variable to be initialized. This also means source control diffs/merges will work better. Given these disadvantages, I'm guessing there's so开发者_如何转开发me advantage to the first format -- but what is it? Surely they execute identically because it's the same to the parser.

There's a slight advantage with the size of the javascript that is sent to the browser; Google's Closure compiler in 'whitespace only' mode will compile the single var version into:

var x=some.initialization.method(),y=something.els(),z;

and the multi as:

var x=some.initialization.method();var y=something.els();var z;

I changed your else to els so that it would compile.

This isn't a massive gain (especially if you are also compressing the files), and the 'simple' compilation mode will do this for you anyway, so I probably wouldn't be too concerned about it unless you can find more compelling reasons.

One reason you may not want to do this is that if you accidentally use a semicolon instead of a comma you've just found a global.

I can't stand all variables in one statement because the variable declaration may be very far from where it's actually used. I know all the arguments for it, and that variable hoisting moves all the vars to the top of the function anyway. But when I see a variable declared at the top of a function and it doesn't get used for another 20 lines, it drives me kind of crazy, specially for loop index variables

The only real advantage is that it saves a couple of bytes per variable, which in a large JS file can add up; remember that JS files are often sent over the wire.

Personally I much prefer a single var per line.

Using a single var statement at the top of your functions is a useful pattern to adopt. It has the following benefits:

• Provides a single place to look for all the local variables needed by the function

• Prevents logical errors when a variable is used before it’s defined

• Helps you remember to declare variables and therefore minimize globals

• Is less code (to type and to transfer over the wire:)

• JSLint likes this pattern

The single var pattern looks like this:

function func() {
    var a = 1,
        b = 2,
        sum = a + b,
        myobject = {},
        i,
        j;

    // function body...

}

For more info look there

The main advantage is that you'll have all variables defined at the very beginning of your function, so you won't end up with a lot of globals occured from variables declared without var, and your code won't fall because of misplaced var statement (calling variable before declaring it)

Other than the on-wire size, it probably helps interpreter performance as well. From Professional Java Script for Web Developers:

A single statement can complete multiple operations faster than multiple statements each performing a single operation. The task, then, is to seek out statements that can be combined in order to decrease the execution time of the overall script.

It went on to recommend declaring variables in a single line.