What is the reason behind JSLint saying there are "too many var statements"

Question

JSLint (with the onevar flag turned on) is flagging some javascript code that I have with the following:

Problem at line 5 character 15: Too many var statements.

I am happy to fix these errors, but I'd like to know, am I doing it for performance or because it is just a bad practice and has a greater potential to introduce bugs in my javascript code. What is the reason behind the onevar flag?

I did look at the JSLint docs for the var keyword but it doesn't specifically talk about why multiple var statements in the same function are bad.

Here is an attempt at an example. Explain how the code will benefit from only having 1 var statement:

function Test(arg) {    var x = arg + 1,        y = cache.GetItem('xyz');    if (y !== null) {       // This is what would cause the warning in JSLint       var request = ajaxPost(/* Parameters here */);     } } 

Answer 1

Javascript does not have block scope. In other languages with it (like c), if you declare a variable in the if statement, you can not access it outside of it, but in javascript you can. The author of JSLint believes it is a bad practice, since you (or other readers) might get confused and think that you can no longer access the variable, but you actually can. Therefore, you should declare all your variables at the top of the function.

Answer 2

The official reason is here, by Douglas Crockford.

To quote:

In many languages, a block introduces a scope. Variables introduced in a block are not visible outside of the block.

In JavaScript, blocks do not introduce a scope. There is only function-scope. A variable introduced anywhere in a function is visible everywhere in the function. JavaScript's blocks confuse experienced programmers and lead to errors because the familiar syntax makes a false promise.

JSLint expects blocks with function, if, switch, while, for, do, and try statements and nowhere else.

In languages with block scope, it is usually recommended that variables be declared at the site of first use. But because JavaScript does not have block scope, it is wiser to declare all of a function's variables at the top of the function. It is recommended that a single var statement be used per function. This can be declined with the vars option.