JSLint, else and Expected exactly one space between '}' and 'else' error

Question

Why JSLint report in code:

function cos(a) {
    var b = 0;
    if (a) {
        b = 1;
    }
    else {
        b = 2;
    }

    return b;
}

error:

Problem at line 6 character 5: Expected exactly one space between '}' and 'else'.

This error can be turned off by disabling Tolerate messy white space option of JSLint.

Or in other words -- why syntax: } else { is better then

...
}
else {
...

Google also uses syntax with } else { form.

But I don't understand why. Google mentioned ''implicit semicolon insertion'', but in context of opening {, not closing one.

Can Javascript insert semicolon after closing } of if block even if next token is else instruction?

Sorry that my question is a bit chaotic -- I tried to think loud.

Answer 1

JSLint is based on Crockford's preferences (which I share in this case).

It's a matter of opinion which is "better".

(Although clearly his opinion is right ;)

Answer 2

It's not a matter of style. It's how ECMAScript works.

For better or for worse, it will automatically insert semicolons at the end of statements where it feels necessary.

JavaScript would interpret this:

function someFunc {
    return
    {
        something: 'My Value'
    };
}

As this:

function someFunc {
    return;
    {
        something: 'My Value'
    };
}

Which is certainly what you don't want.

If you always put the bracket on the same line as the if and if else statement, you won't run into a problem like this.

As with any coding language, the coding style chosen should be the one that minimizes potential risk the most.

Mozilla Developer Network also promotes same line bracketing: https://developer.mozilla.org/en-US/docs/User:GavinSharp_JS_Style_Guidelines#Brackets

Answer 3

JSLint is being very picky here, just enforcing a style that you might not share.

Try JSHint instead:

The project originally started as an effort to make a more configurable version of JSLint—the one that doesn't enforce one particular coding style on its users [...]

Answer 4

JSLint is just being picky here. The guy who wrote it also baked in many stylistic suggestions in order to keep his own code more consistent.

As for semicolon insertion, you shouldn't need to worry here. Inserting a semicolon before the else clause would lead to a syntax error and automatic semicolon insertion only occurs in situations where the resulting code would still be syntactically valid.

If you want to read more on semicolon insertion, I recommend this nice reference

Basically if you insert semicolons everywhere you only need be careful about putting the argument to "return" or "throw" (or the label for "break" and "continue") on the same line.

And when you accidentally forget a semicolon, the only common cases that are likely to bite you are if you start the next line with an array literal (it might parsed as the subscript operator) or a parenthsised expression (it might be parsed as a function call)

Conclusion

Should you omit optional semicolons or not? The answer is a matter of personal preference, but should be made on the basis of informed choice rather than nebulous fears of unknown syntactical traps or nonexistent browser bugs. If you remember the rules given here, you are equipped to make your own choices, and to read any JavaScript easily.

If you choose to omit semicolons where possible, my advice is to insert them immediately before the opening parenthesis or square bracket in any statement that begins with one of those tokens, or any which begins with one of the arithmetic operator tokens "/", "+", or "-" if you should happen to write such a statement.

Whether you omit semicolons or not, you must remember the restricted productions (return, break, continue, throw, and the postfix increment and decrement operators), and you should feel free to use linebreaks everywhere else to improve the readability of your code.

---

By the way, I personally think that the } else { version is prettier. Stop insisting in your evil ways and joins us on the light side of the force :P

Answer 5

I have just finished reading a book titled Mastering JavaScript High Performance. I speak under correction here, but from what I can gather is that "white space" does in fact matter.

It has to do with the way the interpreter fetches the next function. By keeping white space to a minimum (i.e.) using a minifier when your code is ready for deployment, you actually speed up the process.

If the interpreter has to search through the white space to find the next statement this takes time. Perhaps you want to test this with a piece of code that runs a loop say 10,000 times with white space in it and then the same code minified.

The statement to put before the start of the loop would be console.time and finally console.timeEnd at the end of the loop. This will then tell you how many milliseconds the loop took to compute.

Answer 6

The JSLint error/warning is suggesting to alter code to

// naming convention winner? it's subjective
} else if{
    b = 2;
}

from:

}
else if{
 b = 2;
}

It prevents insert semicolons; considered more standard & conventional. most people could agree a tab between the }tabelse if{

is not the most popular method. Interesting how the opening bracket { is placed (space or not) obviously both ar subjected