i inputted the following code into Chrome's javascript console:
function test() {
var a = [1, 2, 3, 4];
for (var i = 0; i < a.length; i++) {
var a = i;
console.log(a);
}
console.log(a);
}
test();When I called test(), instead of getting the values 0,1,2,3, I got 0 twice. It appears the loop only ran once, does anyone know why?
It's because you're using the same variable, a, in both your loop and outside of it. This code works properly, as you want:
function test() {
var a = [1, 2, 3, 4];
for (var i = 0; i < a.length; i++) {
var b = i;
console.log(b);
}
console.log(a);
}
test();
Variable declarations (var a, etc) are "hoisted" inside the function. A for loop does not have a separate scope. The second use of var is ignored and the self-same a is overwritten inside of the first iteration of the loop. Since a now equals 0, the loop ends.
You can read more about hoisting here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/var
Because variable declarations (and declarations in general) are processed before any code is executed, declaring a variable anywhere in the code is equivalent to declaring it at the top. This also means that a variable can appear to be used before it's declared. This behavior is called "hoisting", as it appears that the variable declaration is moved to the top of the function or global code.
For that reason, it is recommended to always declare variables at the top of their scope (the top of global code and the top of function code) so it's clear which variables are function scoped (local) and which are resolved on the scope chain.
That is because you are overwriting your variable a. So in first iteration, you are changing a from array to 0. On next iteration, a does not have property length and loop breaks. So you get 0 twice.
function test() {
var a = [1, 2, 3, 4];
var len = a.length;
for (var i = 0; i < len; i++) {
var a = i;
console.log(a);
}
console.log(a);
}
test();Better way to do:
function test() {
var a = [1, 2, 3, 4];
for (var i = 0; i < a.length; i++) {
console.log(i);
}
console.log(a);
}
test();