Tell me more ×
Code Review Stack Exchange is a question and answer site for peer programmer code reviews. It's 100% free, no registration required.
up vote 2 down vote favorite
2

I have been setting multiple variables like this 

function doSomething() {

    var FirstName = $FirstName.data("ov");
    var LastName = $LastName.data("ov");
    var Company = $Company.data("ov");
    var Website = $Website.data("ov");

}

I just read some reviewed code and both reviewers advised setting the variables in a single statement, like this:

function doSomething() {

    var FirstName = $FirstName.data("ov"),
        LastName = $LastName.data("ov"),
        Company = $Company.data("ov"),
        Website = $Website.data("ov");

}

What would be the advantage of doing it the second way? Is there a performance benefit? Is it that there is less code?

share|improve this question

3 Answers

up vote 2 down vote accepted

From a very good book called JavaScript Patterns:

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)

The author also recommends initializing the variables when you declare them when possible.

share|improve this answer
Those are some compelling reasons, the least of which is a performance boost. – Evik James Jun 12 '12 at 21:10
@Evik - mucking up the global namespace, by forgetting the var keyword can have huge performance impacts. So, I assume you are referring to the "is less code" bullet. – Ryan Miller Jun 12 '12 at 21:13
I tend to not mistakes like that, forgetting to var it. I made that mistake early on and killed my browser memory doing a bunch of Ajax stuff. Assuming I code it correctly, it will have little performance advantage. The real advantage will be in creating the necessary local variables right away at the top of the function. – Evik James Jun 12 '12 at 21:24
I'd argue that at least #1 and #3 do not matter in this case. The first code example does provide a "single place to look for" and minimizes globals just as much as the second example. In fact, the only example of those 4 that seems to make a difference in this case is #4 and, even then, not by much(in this particular case - assuming spaces are used - there are exactly as many bytes being sent) – luiscubal Jun 12 '12 at 22:42
up vote 1 down vote

In terms of performance, there is little difference across both methods. Another test found here which has greater browser coverage.

In terms of readability, I'd go for the multiple variables using a single var since it is less messy.

All in all, it depends on you.

share|improve this answer
up vote 1 down vote

There should be no noticeable difference in performance (even if there was, it would most likely be negligible) and they mean the same.

It's just a matter of picking the one that's most readable. Frankly, I don't find the second example more readable than the first, but this is subjective.

EDIT: One possible difference is that smaller code (assuming those are charaters replacing "var" are tabs and not spaces) might reduce traffic, making the page faster. However, in practice, I think the best JS minifiers should handle that sort of thing for you.

share|improve this answer
I think you meant "there should be NO noticeable..." Is that correct? – Evik James Jun 12 '12 at 21:05
@EvikJames Indeed. Sorry for the mistake. – luiscubal Jun 12 '12 at 21:06

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.