How to setTimeout inside a loop

Question

Are you trying to set a timeout to run multiple functions with some delay between them? Is the timeout inside of a for loop? Are your functions all firing off at the same time, and not respecting the timeout, or otherwise causing messy behaviour?

It is intuitive, but incorrect to write it like this:

for (var i = 0; i < moves.length; i++) {
  setTimeout(chooseOne(moves[i]), i * 1000 + 1000);
}

SOLUTION:

The solution is to pass the i values to the timeout indirectly, like this. Write the loop, call your timeout function inside the loop and pass that function the i value.

function clickedOne() {
    for (var i = 0; i < moves.length; ++i) {
      myTimeout(i);
    }
}

then in a separate function, set the timeout, pass an anonymous function as your first parameter, inside that function I call my chooseOne function and pass it the unique value for each iteration. Now you can write a comma, and provide the second parameter for setTimeout which is your timeout. My timeout is one second times i, so each function will execute one second after the one that precedes it.

function myTimeout(i) {
  setTimeout(function() { chooseOne(moves[i]); }, 1000 * i);
}

I actually don't know why this works and the first method does not.

`moves.forEach(function(move, i) { setTimeout(function() { chooseOne(move); }, i * 1000 + 1000); });` — Arun P Johny, Apr 15 '16 at 03:33
http://stackoverflow.com/questions/5226285/settimeout-in-for-loop-does-not-print-consecutive-values — Dennis Nerush, Apr 15 '16 at 03:34
@Tushar that is for the problem that arises from http://stackoverflow.com/questions/2037203/why-is-my-function-call-that-should-be-scheduled-by-settimeout-executed-immediat — Arun P Johny, Apr 15 '16 at 03:38

Mahesh Chavda · Answer 1 · 2016-04-15T12:55:14.447

-1

Try this:

var i = 0;
setTimeout(function(){
  if(i < moves.length){
      chooseOne(moves[i++]);
    }
}, i * 1000 + 1000);

edited Apr 15 '16 at 12:55

answered Apr 15 '16 at 03:44

Mahesh Chavda

593
3
9

1

This passes the first value from the array to the function, and correctly puts that on a timer. It does not iterate through the whole array, however, and none of the other values get used. – PencilCrate Apr 15 '16 at 03:56
Updated my answer. – Mahesh Chavda Apr 15 '16 at 12:55

How to setTimeout inside a loop

1 Answers1

Linked