Use of 'var' in FOR initialiser

[Andrew Poulos]

If I have some code in a function that looks something like this:

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var i = 0; i < b; i++) {
//blah
}
}

JSLint tells me that "Identifier 'i' already declared as var" but I
thought it was correct practice to stick 'var' in front of the variable
in a FOR statement's initialiser. What is the correct use of 'var' in
this situation?

Andrew Poulos

 

[Randy Webb]

Andrew Poulos said the following on 1/17/2006 7:53 AM:

If I have some code in a function that looks something like this:

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var i = 0; i < b; i++) {
//blah
}
}

JSLint tells me that "Identifier 'i' already declared as var" but I
thought it was correct practice to stick 'var' in front of the variable
in a FOR statement's initialiser. What is the correct use of 'var' in
this situation?

I would use var i so that i stays local instead of becoming a global
variable.

As to why JSLint throws a caution up is something you would have to ask
Douglas about. It may see both declarations and trigger the note.

Try change it to something like this:

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var j = 0; j < b; j++) {
//blah
}
}

To see if that satisfies JSLint. If it does, then it is seeing both and
raising the issue when it shouldn't be (not to me anyway).

 

[Michael Winter]

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var i = 0; i < b; i++) {
//blah
}
}

JSLint tells me that "Identifier 'i' already declared as var"

That's because it is. There is no block scope in ECMAScript so the
declaration can appear anywhere that is legal, including the end of the
code, and still have the desired effect (initialisation must be done in
a timely fashion, though).

The most obvious variation is, of course:

var i;
if(x) {
for(i = 0; i < a; ++i) {
/* ... */
}
} else {
for(i = 0; i < b; ++i) {
/* ... */
}
}

but I thought it was correct practice to stick 'var' in front of the
variable in a FOR statement's initialiser.

Not particularly. The important thing is to make variables that should
be local, well, local. Whether that's accomplished in the initialiser of
a for statement, or elsewhere, doesn't matter all that much.

[snip]

Mike

 

[Richard Cornford]

If I have some code in a function that looks something
like this:

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var i = 0; i < b; i++) {
//blah
}
}

JSLint tells me that "Identifier 'i' already declared
as var" but I thought it was correct practice to stick
'var' in front of the variable in a FOR statement's
initialiser. What is the correct use of 'var' in this
situation?

Some languages, such a Java, are block-scoped and declaring variables
within - for - makes those variables only visible within the following
block. When following the general programming axiom that no variable
should be given more scope than it absolutely needs you would want the -
i - variables to be scoped to just the - for - blocks, and so have to
declare the variable for each block.

The scoping units of javascript are functions. If a variable is declared
within a function (and at any point within that function) then it is
visible to the entire function and declared from the moment the function
starts to execute. (As javascript enters then execution contexts of a
function, for each variable declaration within a function body, a named
property is created on the Variable/Activation object for that execution
context (a process called "variable instantiation"), providing the local
variables for the execution of the function). It doesn't matter where
within a function body a variable declaration is to be found, the
resulting local variables exist prior to the execution of the first
statement within the function. (Initial local variable creation does not
include the assignment of (non-default) values to those variables, the
values are not assigned until the assignment expressions within the
function body are executed).

The practical upshot of putting - var i - in each - for - statement is
that the - i - variable is declared twice within the same scope (and it
is this that JSLint is objecting to). In practice all javascript does
when a variable is declared twice in the same scope is to repeat the
process of variable instantiation for that variable, which will not
effect how the subsequent code executes.

It is widely felt (and this is opinion, though often informed by
experience) that local variables should be declared at the beginning of
the scope to which they apply, and once only. In javascript that would
mean declaring all function local variables at the start of a function
body. JSLint's attitude is a push in this sort of 'best practice'
direction, rather than a requirement of the language itself.

Richard.

 

[Martin Honnen]

If I have some code in a function that looks something like this:

if (x) {
for (var i = 0; i < a; i++) {
//blah
}
} else {
for (var i = 0; i < b; i++) {
//blah
}
}

JSLint tells me that "Identifier 'i' already declared as var" but I
thought it was correct practice to stick 'var' in front of the variable
in a FOR statement's initialiser. What is the correct use of 'var' in
this situation?

Well with JavaScript any var declaration is "hoisted" to the beginning
of the execution context so you could do
var i;
if (x) {
for (i = 0; i < a; i++) {
//blah
}
} else {
for (i = 0; i < b; i++) {
//blah
}
}
and probably that lint tool won't bark anymore and you have the same
semantics as before.
But as in many other languages you can declare and use loop variables
just for the loop scope I would not change the coding style of
for (var i
in JavaScript just because a lint tool barks about a redeclared
variable. That is nothing wrong in your code example and in JavaScript,
better one var declaration too much (without changing the semantics) but
one missing (with the drastic side effect of creating a global variable).

 

[Thomas 'PointedEars' Lahn]

Well with JavaScript any var declaration is "hoisted" to the beginning
of the execution context so you could do
var i;
if (x) {
for (i = 0; i < a; i++) {
//blah
}
} else {
for (i = 0; i < b; i++) {
//blah
}
}
and probably that lint tool won't bark anymore and you have the same
semantics as before.
But as in many other languages you can declare and use loop variables
just for the loop scope I would not change the coding style of
for (var i
in JavaScript just because a lint tool barks about a redeclared
variable. That is nothing wrong in your code example and in JavaScript,
better one var declaration too much (without changing the semantics) but
one missing (with the drastic side effect of creating a global variable).

I agree that jslint barks is not always a good reason to change code style,
and that declaring variables is better than not to declare them at all (see
also the previous discussion on surprising IE scope chain behavior.)

However, whenever a variable is redeclared, you get a warning in the
JavaScript console of Gecko-based browsers (unless you filter all warnings,
where some of them such as "_un_declared variable" are indeed helpful).
This tends to disturb me, especially when debugging code. Therefore I
watch for that I declare a variable only once per execution context; if I
reuse a variable in more than one loop in the same context, I declare the
variable only in the first loop or more seldom, as Richard said, before
the first loop.

Another way to follow the code style known from block scoping without
causing warnings would be to use a different iterator variable in every
independent loop. AFAIK I do not do that; reason: keep your execution
context clean.


PointedEars