Immediately Invoked Function Expression use case:inadvertent sharing via closures

Question

var result=[];
for(var i=0;i<5;i++){
result.push(function () {return i});
}
console.log(result[1]());  //5 not 1

I think the result should be [0,1,2,3,4] and I don't understand why the value should be 5. How does it work? I am completely confused.

score 0 · Answer 1 · answered Aug 05 '14 at 16:16

Because JavaScript does not have block scope, it has function scope. There is only one i variable, and it exists for the whole function. It is changed from 0, to 1, and so on, up to 5. All of the closures reference this same variable.

You can fix it by passing the value in to an immediately-invoked function that returns another function:

result.push((function (i) { return function() { return i; } }(i));

In this case you pass the value of i in to the outer function, which returns another function that returns the argument to this inner function, effectively capturing the value of the outer i at that particular moment.

Immediately Invoked Function Expression use case:inadvertent sharing via closures

1 Answers1