JavaScript variable binding and loop

closures, javascript, loops, scope

Solution

Not really anything more than the two ways that you have proposed, but here's another

for(var it = 0; it < 2; it++)
{
    (function() {
        var m = it;   
        setTimeout(function() {
            alert(m);
        }, 1);
    })(); 
}

Essentially, you need to capture the variable value in a closure. This method uses an immediately invoked anonymous function to capture the outer variable value `it` in a local variable `m`.

Here's a Working Demo to play with. add /edit to the URL to see the code

Problem

Consider such loop: ``` for(var it = 0; it < 2; it++) { setTimeout(function() { alert(it); }, 1); } ``` The output is: ``` => 2 => 2 ``` I would like it to be: 0, 1. I see two ways to fix it: Solution # 1. This one based on the fact that we can pass data to setTimeout. ``` for(var it = 0; it < 2; it++) { setTimeout(function(data) { alert(data); }, 1, it); } ``` Solution # 2. ``` function foo(data) { setTimeout(function() { alert(data); }, 1); } for(var it = 0; it < 2; it++) { foo(it); } ``` Are there any other alternatives?

Original source