Question

I have a code like this:

var increment = 200;

for (var j=0; j<10; j++){

  var print = function(){ console.log("===== J ===== "+j); }

  setTimeout(print, increment); 

  increment+= 200;

}  

Console always print 10. I think that could be for statement and setTimeout are executed in different threads. How i can do to print the correct value of j?

Thanks in advance.

Answer 1

This is a standard binding issue, you can find a lot of similar questions on stackoverflow.

Basically, it is using one ‘j’ for all values. Try this instead:

function getBoundLog(j)
{
   return function(){console.log("===== J ===== "+j);}
}
var increment = 200;

for (var j=0; j<10; j++){

  setTimeout(getBoundLog(j), increment); 

  increment+= 200;

}