CODEWITHSUNDEEP
javascriptjqueryjslint
Alexa
Alexa

Reputation: 225

the JSLint code quality tool

So I checked my javascript using this: http://www.jslint.com/

and if I don't wrap IF/FOR statements between { }, I get "errors" like this:

Problem at line 152 character 27: Expected '{' and instead saw 'reset()'.

or if I initialize variables inside FOR I get:

Problem at line 154 character 19: Move 'var' declarations to the top of the function.

Why are these considered errors? Shouldn't these be considered good practice instead because they actually reduce the size of the code, which for javascript is even more important than the speed of the code?

Upvotes: 2

Views: 739

Answers (6)

Pete Wilson
Pete Wilson

Reputation: 8694

You ask: "Why are these considered errors?" They're much more than bad practice; they're positively malicious. That's because they encourage later bugs that will be almost impossible to find. This same death-wish omission of braces is allowed in C and C++, too, and it's just as much of an error there.

If, like me, you'd tried to save a couple of keystrokes by omitting braces and then been bitten and beaten up by your mistake, I promise you wouldn't be asking this question :-)

Upvotes: 0

Edgar Villegas Alvarado
Edgar Villegas Alvarado

Reputation: 18344

Respect tho the second issue, JSlint recommends it because javascript vars are always function scoped, not block scoped. Doing this:

function func(){
  var i;
  alert('foo');
  for(i = 0; i<3; i++){
     alert(i);
  }
  alert(i);
}

is exactly (100% exactly!!) the same as:

function func(){
  alert('foo');
  for(var i = 0; i<3; i++){
     alert(i);
  }
  alert(i);
}

So i is not for-scoped (as in other languages). That's why jslint recommends to put all vars on top of functions, so you don't get confused thinking there are block-scoped variables.

Respect of the first issue, I agree with you. I don't see it as big a problem. But JSLint sees it as a problem because, if you later add lines to your if statement and forget to put the curly braces, you'll have a logic error, as Jeff pointed out.

Before:

if (x > 10)
    alert("it's obvious x is positive");

After some changes to the code:

if (x > 10)
    alert("it's obvious x is positive");  
    alert("x is greater than 10");  //Logic error

A problem that wouldn't have happened using curly braces.

Upvotes: 3

T.J. Crowder
T.J. Crowder

Reputation: 1074228

The first thing, braces on if statements, reflects the JSLint author's belief that omitting the braces leads to maintenance issues (a belief I happen to share, but that's neither here nor there).

The second thing is actually language-specific: Putting the var anywhere other than the top of the scope (function, or global) is actually misleading to anyone reading the code, because regardless of where you put it, it's exactly as though it were at the top of the scope. Details: Poor, misunderstood var

Upvotes: 0

Jeff Avallone
Jeff Avallone

Reputation: 141

JSLint recommends that you wrap if and for statements in braces because it can lead to hard to track down errors if you are not careful with your indenting. For example:

if (somecondition)
    step1();
    step2();

From the indenting, it looks like step1() and step2() are going to execute only if somecondition is true, but in reality step2() will always run since the braces are missing.

If you are really concerned about file size, I'd suggest looking into a JS compressor like yuicompressor. Most of these will remove the braces around if/for statements that don't need them. Then you can have the best of both worlds: readable code and small file sizes when it's served.

Upvotes: 4

Zirak
Zirak

Reputation: 39808

JSLint is a code quality tool aimed to reduce the number of mistakes. You know that you can only write a single statement in an if loop, without needing to wrap it with braces, but that guy doesn't. And what if you accidentally do it one day?

Reducing file-size during development is hardly necessary, that's what minifiers are for. During development you need to make the code work and make sense.

The variables at top of functions is an annoying debate of coding styles, and you can turn off notifications about it in the options.

Anyway, just ignore the errors you don't care about.

Upvotes: 1

Karl Nicoll
Karl Nicoll

Reputation: 16419

For the if statement error, the lack of an opening brace is considered bad practice because it makes for harder maintenance. If, for example, you wanted to add another statement inside the if statement, you'd end up needing to add the braces anyway, so it makes maintenance easier just to include them in the first place.

The second error, I find a bit.. opinionated, since personally I prefer to declare variables closer to where they are used, instead of at the top of a function.

Personally, I prefer to use JSHint these days, since Crockfords Lint I find to be less about correct code, and more about Crockfords opinion of what JavaScript should look like, everyone else's opinion be damned.

Upvotes: 10

Related Questions