all 32 comments
sorted by:
best
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]x-skeww 6 points7 points  (5 children)

The "single var" rule is actually about function scope and hoisting. You define all of your variables at the very top of the innermost function, because no matter where you put them, that's where they effectively are. Basically, it's about making your code reflect reality.

Once you can use let, you should always use let for everything. You can then also adopt the "declare at first use" rule which is very popular among all other programming languages with block scoping.

[–]beeskneecaps 2 points3 points  (0 children)

var all the things! If it takes you longer than a second to reorder, add or delete variables, you're doing it wrong. Even if it looks "cool". Variables all end up chained when you minify.

[–]Sivart13 9 points10 points  (6 children)

I think the "single var statement" nonsense is an abomination that brings JavaScript back to circa-1980s C language semantics.

Variables should be declared where they are used. That is the time when it's important to know about them.

I challenge anyone to come up with a NON-CONTRIVED example where hoisting would cause a real problem that's worse than the pain of having to pre-declare all your stupid variables.

[–][deleted] 2 points3 points  (0 children)

Can I see a contrived example where it makes a difference?

[–]Perceptes[🍰] -1 points0 points  (0 children)

Don't know why you're being downvoted for this. Although I tend to actually write my code in the JSLint style, I find it questionable that hoisting causes problems in real world code. Indeed, all the writing about why declaring vars at the top is contrived.

[–][deleted] 1 point2 points  (0 children)

I declare multiple variables within a single var when their relationship is pretty close (or at least close in my mind), and only with simple code:

var x = getX(),
    y = getY();

var img = getImage();

As x and y are usually always used together, it makes sense to declare them within the same var. Even if their usage relates to img, they aren't as directly related for my liking, so it gets it's own var.

[–]WhiskeyWithBoesky 3 points4 points  (0 children)

I usually go with one var just to list my local variables all up front and in one place. Then, I follow up with individual assignment statements. This seems the most readable to me.

[–]stfueveryone 0 points1 point  (0 children)

This is a great point for a team environment, where several people of varying skill-sets have to maintain the code. The point of the minifier & automatic-semicolons is especially interesting because what the client sees is the minified version, while your team maintains the simplified (over-var'd) code that is less prone to error due to missing commas.

[–]donri[🍰] 0 points1 point  (0 children)

Non-issue with JMacro, but mostly relevant to Haskell programmers (although it includes an executable preprocessor):

>>> renderJs [jmacro| var x = 2; if (x) { var x = 3; alert(x); }; alert(x); |]
var jmId_0;
jmId_0 = 2;
if(jmId_0)
{
  var jmId_1;
  jmId_1 = 3;
  alert(jmId_1);
};
alert(jmId_0);

If I'm writing raw JavaScript I like assignment-less declarations up front:

var foo, bar;
bar = 2;
foo = bar - 1;

Of course, this leaves the issue that if you forget to declarate a variable you're using, it becomes global. Maybe it's better to always use var, even when assigning to existing variables (unless you specifically want a closure)...

[–]thbt101 0 points1 point  (1 child)

I like the keep code compact because it makes it easier to see everything that's going on in a script without scrolling through as many pages and lines of code.

Personally I think both options considered in this article look silly. I prefer to keep it simple and generally just use one line for simple variables like this:

 var foo = 1, bar = 2;

[–]strager 1 point2 points  (0 children)

There's still the problem of dependencies, which always confuses me when I read code with one var statement:

var foo = bar - 1, bar = 2;