James Wiseman

In JavaScript we can assign a function expression to a variable, like so:

var foo = function() {
    return 1;
}; //assign function expression to 'foo'

This is perfectly valid, and often useful.

It is also possible to assign a variable the return value of the function expression by invoking the function, like so:

var foo = (function() {
    return 1;
}()); //assign '1' to 'foo'

This is also valid, although less commonly useful.

These are two distinct techniques with distinct conventions, so, the following may well give rise to confusion:

var foo = (function() {
    return 1;
});//assign function expression to 'foo'

The above is equivalent to the first sample of code, and will execute in exactly the same way. JSLint encourages you to wrap invoked function expressions with parentheses. Wrapping non-invoked function expressions in the same way may be indicative of something non-intentional, or at very least be misinterpreted by a future developer.

In other words, stick to the first convention for the assignment of function expressions.

A Guide To JSLint Messages

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

This is the longest error message that JSLint boasts. In full it reads:

“Wrap an immediate function invocation in parentheses to assist the reader in understanding that the expression is the result of a function, and not the function itself.”

What a mouthful!

This is relatively simple to explain, however:

var a = 1 + function() { return 1; }(); //assigns '2' to the variable 'a'

The JSLint error can be addressed by adding parentheses around the function:

var a = 1 + (function() { return 1; })(); //assigns '2' to the variable 'a'

However, this will yield another JSLint message Move the invocation into the parens that contain the function.

So, of course to address this, we wrap the whole invocation with the parentheses, like so:

var a = 1 + (function() { return 1; }()); //assigns '2' to the variable 'a'

So what is the reason for this? Well, actually, the message itself explains is quite well: “Assist the reader in understanding that the expression is the result of a function, and not the function itself.” Not all of JSLint is about bugs and problems. Some are all about achieving a consistent style. This is one of them.

This is similar to another wordy JavaScript message: Function statements are not invocable. Wrap the whole function invocation in parens, which captures isolated unwrapped function declarations. Seen in the following example:

var a = 0;
function foo(a) {
    alert(a);
} (a);

Here, we can see that, again, the invocation is missing a wrapping parentheses. However, in direct contrast to the first example, the code immediately above will fail.

A Guide To JSLint Messages

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

JSLint reports this error when a function name has been omitted from a functions statement. For example:

function(a) {
    alert(a);
}

It is possible that the original intention was more like the following:

function foo(a) {
    alert(a);
}

Although, it is also conceivable that a function expression was also intended:

var foo = function(a) {
    alert(a);
}

A Guide To JSLint Messages

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

This message was acutally too long for the subject title. In full, it reads:

“Function statements should not be placed in blocks. Use a function expression or move the statement to the top of the outer function.”

We can reproduce this message with the folllowing code:

var a = 0;
if (a === 0) {
    function b() {
        alert(1);
    }
} else {
    function b(a) {
        alert(2);
    }
}
b(); //call the function. But which one?

The intention is to decalre a function based on some condition, but this doesn’t necessarily work, and the condition is likely to be ignored. Instead we are at the mercy of each inditidual implementation of the JavaScript interpreter.  With the above examples, we may see either “1″ or “2″ alerted.

To achieve what we are attempting we need to use a function expression, like so:

var a = 0;
var b;
if (a === 0) {
    b = function() {
        alert(1);
    }
} else {
    b = function(a) {
        alert(2);
    }
}
b(); //call the function.

This will work every time.

A Guide To JSLint Messages

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

With this message we move deep into the heart of JavaScript closures. Without wanting to engage into a discussion about what they or their relative merits are, we can examine how this message might arise. Take the following code:

var a = 0;
(function(a) {
    alert(a);
})(a);

The parentheses around the function are necessary, because when omitted, the compiler assumes it is a Function Statement (see links below).

When referring to ‘Invocation’ we actually mean the bit of code (a) at the very end of the block of code. Although the code itself will execute perfectly, JSLint prefers that everything is more self-contained, so insists on the following convention instead:

var a = 0;
(function(a) {
    alert(a);
}(a));

This is almost identical, except the invocation (a) now appears within the parentheses that wrap the function.

The most convincing for me is that the initial parentheses isolates the block of code that is being invoked by the second set of parentheses. In addition to this, JSLint has been designed specifically to eliminate conventions and behaviours that have been proven to lead to bugs and issues, so it is possible that sometime in the past the first convention has yielded a bug or some sort of issue.

Some Links

The above function code follows a convention more commonly known as the JavaScript Module Pattern

To demystify the mire of Function Declarations, Function Expressions and Function Statements, refer the article Named function expressions demystified by Juriy “kangax” Zaytsev.

Also thanks to StackOverflow for helping me answer this: Question –  Solution for JSLint Errors

A Guide To JSLint Messages

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