0

I am calling a for loop multiple times. I would like to save a single setTimeout for each index. The idea is to use the loop's index as setTimeout's array index, but setTimeout returns an incremental ID number, I would like to reset it, or override to take control of the returning ID, so I can identify each timeout with a given index, always within the range of loop's index that is executed over and over again. Being able to use clearTimeout later on with a specific index.

var timeouts = [];
for(var i=0; i < 5 ; i++) {
   ...
   (function(delay, timeouts, i){
      // Keeps a reference of the timeout to clear it later.
      timeouts[i] = setTimeout(function() {
         countInView--;
      }, delay);
      console.log("i: "+5+ " | timeout: "+timeouts[i]);
      // i: 5 | timeout: 25 -> Surpasses index, 
      // I'd like to override positions by ID or by index.
   }(delay, timeouts, i));
   ...
}

  1. When the loop is executed more than once, the timeouts[i] value surpasses the value of loop's index:

  2. I just want to clear the timeout in other part of the code, but when reaching this part of the code, the value of timeouts[i] may be 140, and loop i value only 3, so I never can clear the 3rd(nor any) setTimeout intended to be saved:

    clearTimeout(timeouts[i]);
another
  • 3,440
  • 4
  • 27
  • 34
  • 3
    If you just check `setTimeout()` doc, you will see it returns integer ID of timeout, which can be use with `clearTimeout(intID)` ... Now use relevant array method instead: `timeouts.push(setTimeout(...));`. But i'm not sure if you wish to remove any specific timeout, and if so, depending of what?!... – A. Wolff May 28 '16 at 10:31
  • Thanks for the tip I have read many references except w3c. Yes I'd like to remove by index, (the index that is not visible on viewport anymore) – another May 28 '16 at 10:43
  • @Roizpi : You could use 2 dimensional array for this, first dimension will change with every tim for lopp executes, second dimension will be changed inside your loop. for example, timeouts[0][4] will be your first for loop with 5th iteration and timeouts[3][2] will be 4th time execution of for loop and it's second iteration – Parag Bhayani May 28 '16 at 10:47
  • @A @P I have reformulated my questions. Thanks for all info, I am dealing with two dimensional solutions. – another May 28 '16 at 12:21

1 Answers1

2

You could use 2 dimensional array for this, first dimension will change along with the for loop index, whilst second dimension could remain in 0 to take control of the assigned timeout's IDs for each iteration.

For saving setTimeout within a index in a loop

var timeouts = []; // Two  dimensional array
for (i = 0; i < 5; i++)  
    timeouts[i] = [];

for(var i=0; i < 5 ; i++) {
    ...
    (function(delay, $element, savedtimeout){
        savedtimeout[0] = setTimeout(function() {
            countInView--;
        }, delay, savedtimeout);
    }(delay, $element, timeouts[i]));
    ...
}

For clear setTimeout within a index in a loop

if(timeouts[i][0] != null) {
    //Removes the timeout from the queue
    clearTimeout(timeouts[i][0]);
}
another
  • 3,440
  • 4
  • 27
  • 34
Parag Bhayani
  • 3,280
  • 2
  • 28
  • 52
  • Thank you, is like all examples I have seen so far using this. But I have never seen someone removing it with a given index. I'd like to clear a specific position in the array of setTimeout, rather than using pop() or shift(). – another May 28 '16 at 10:53
  • @Roizpi: Does this update approach help you, where I have maintained 2 dimensional array for time outs... – Parag Bhayani May 28 '16 at 10:57
  • @Roizpi: is it helpful?? – Parag Bhayani May 28 '16 at 11:05
  • @Roizpi : Then you can clearTimeout(timeouts[0][0]) //so it will clear first timeout of first iteration – Parag Bhayani May 28 '16 at 11:33
  • @Pa If the 1st time loop executes I trigger only 3 delayed actions for 1minute delay, the 2nd time loop executes, I want to remove 2, I will be already on second dimension(or maybe 3rd), and I will only not be able to remove the past setTimeouts, but also I will be creating a second timeout for the same iteration. I only want to save a single setTimeout per iteration, in the example I am trying to save 5, but in future iterations I want to be able to clear the same index that was saved previously, if a condition occurs. Sorry if I misunderstood, (still you're not using push). – another May 28 '16 at 11:42
  • @roizpi: so if i understand you clearly, if you are in second time execution of for loop and creating third time out then you want remove the third timeout of first for loop execution.. And if you are executing for loop4th time then you want to clear timeout of 3rd execution, right??? – Parag Bhayani May 28 '16 at 11:47
  • @Pa Yes, if the position of timeout's array for one iteration is null and another condition is true, then create new timeout, but if other condition is true, remove any previous timeout for this iteration's index. Thanks for your time. – another May 28 '16 at 12:08
  • @Roizpi: You need your clearTimeOut logic out of the for loop? where it should be? would you give me rough idea about it... – Parag Bhayani May 28 '16 at 13:50
  • @P I have the solution, I evolved it through your answer, I guess I will edit your answer and give it as accepted answer. Or shall I post my own?. Cheers. – another May 28 '16 at 14:10