JSLint Messages – Move ‘var’ declarations to the top of the function.

Principles

Most developers are have instilled within themselves certain fundamental core programming practices. Possibly the most famous of these is the DRY (Don’t Repeat Yourself) Principle, which states that duplication can lead to maintenance nightmares, poor factoring, and logical contradictions.

But as with many principles in programming, there are always trade-offs, and times where the rigorous application of a principle can be unhelpful and even counter-productive.

The counterpart to DRY is WET (Write Every Time), and there are scenarios where it makes sense to duplicate code, as described in the articles: Write Every Time Dilutes performance Bottlenecks and Beware The Share.

The JSLint Error

Another principle that is preached almost religiously is the efficient management of resources, and one strategy for doing this is to allocate any resources as late as possible, and  release them as early as possible. The use of block scoping is a particularly common key for achieving this.

This gives rise to code similar to the following:

var a = 1;
if (x === a){
    var b = 2; //'try' giving variable 'b' block scope
    //do other stuff
}

In languages such as C++, C# and Java the above convention would limit the scope and lifetime of the variable ‘b’ to the ‘if’ block.

JavaScript, however, has no block scoping, and any variables declared within a block will be ‘hoisted’ to the top of the nearest scope when the code is picked up by the compiler. This is either the nearest containing function, or global scope. In short, this will make them visible outside the originally intended scope.

JSLint is all about reducing bugs, and had the author of this StackOverflow question run their code through JSLint, then they may never have had to ask a question at all.

Adding (Pseudo) Block Scoping

If you really wanted to enforce scoping down at this level then the following convention might help:

var a = 1;
if (x === a){
    (function(){
        var b = 2; //give variable 'b' (pseudo) block scope
        //do other stuff
    }());
}

Here we’ve wrapped the code in an anonymous function, and invoked it immediately (thanks to the set of parens at the end).

But JSLint Stops Scanning

Yeah, sometimes it does.

I have tried to remain neutral in all my posts on JSLint messages to date. Here, however I am going to jump off the fence and offer a sentiment of bafflement.

JSLint deems some errors so serious that it immediately ceases scanning. For me this is understandable in the event that it encounters utterly unparsable code and literally cannot continue, however, I just don’t understand why it must stop dead with the following:

for (var x=0; x<10 x++){
    //do something
}

And it appears I am not alone. A very similar query posted on the JSLint GitHub repository failed to yield any explanation before the thread was closed.

Any ideas anyone?

A Guide To JSLint Messages

This article is one of a series on the error and warning messages produced by JSLint.

Leave a Reply