setTimeout und jedes array

Haben Sie drei grundlegende Optionen:

1. Für Schleife + setTimeout
   
   ... initialisieren jeder sofort, aber Staffeln Sie die Startzeiten auf der Basis der index-position, damit Sie nicht alle gehen zur gleichen Zeit.
2. setTimeout + bedingte Rekursion
   
   ... schauen Sie in jedem n Sekunden - und ich werde Ihnen sagen, wenn Sie eine weitere
3. setInterval + bedingte clearInterval
   
   ... läuft weiter jeden n Sekunden, bis ich Ihnen sagen, zu stoppen

Hier ist jeder einzelne von denen ausgearbeitet wird, mit einem Beispiel arbeiten:

1. Für Schleife + setTimeout

Ein paar Hinweise auf diesen einen. Das ist so etwas wie der Beginn ein Staffellauf und die übergabe von Anweisungen vor der Zeit, um jeden Läufer starten bei exakt 5:00 und 5:02 und 5:04, unabhängig davon, ob die person hinter Ihnen fertig vor langer Zeit oder noch nicht angekommen.

Können, können Sie auch nicht mit einem regulären for i=0 loop, weil das für die Betreiber nicht definieren neue Funktion Rahmen. Somit Objekt festgelegten Werte innerhalb der einzelnen for-Schleife gilt in Iterationen. Durch die Zeit setTimeout aufgerufen wird, wird nur der aktuellste Wert. Wir brauchen also einen Verschluss um den Wert zu speichern in jeder Schleife. Ich habe Array.der Prototyp.forEach(), aber wenn Sie wollen, verwenden Sie die forEach-Implementierungen in jQuery oder Unterstreichen, dann klappt das auch.

JS:

function ArrayPlusDelay(array, delegate, delay) {
 
  //initialize all calls right away
  array.forEach(function (el, i) {
    setTimeout(function() {
        //each loop, call passed in function
        delegate( array[i]);

      //stagger the timeout for each loop by the index
      }, i * delay);
  })
 
}

//call like this
ArrayPlusDelay(['a','b','c'], function(obj) {console.log(obj)},1000)

2. setTimeout + bedingte Rekursion

Für die unteren beiden Optionen, wir machen unsere eigenen loops, also müssen wir verfolgen den index selbst, der Initialisierung auf null und Inkrementieren der gesamten.

Für diese ein, wir werden eine) call setTimeout, die einmal ausgeführt, b) bewerten Sie das array an der Indexposition c) prüfen, ob es weitere Elemente im array und wenn ja, beginnen Sie wieder bei a).

JS:

   
function ArrayPlusDelay(array, delegate, delay) {
  var i = 0
  
  function loop() {
  	  //each loop, call passed in function
      delegate(array[i]);
      
      //increment, and if we're still here, call again
      if (i++ < array.length - 1)
          setTimeout(loop, delay); //recursive
  }

  //seed first call
  setTimeout(loop, delay);
}

//call like this
ArrayPlusDelay(['d','e','f'], function(obj) {console.log(obj)},1000)

3. setInterval + bedingte clearInterval

HINWEIS: Die Funktion setInterval laufen immer einmal genannt. Es ist return-Wert, wenn Sie zunächst wird eine Referenz auf das Intervall, so ist es oft kombiniert mit der Funktion clearInterval Optional schalten Sie es nach unten die Straße

JS:

function ArrayPlusDelay(array, delegate, delay) {
  var i = 0
  
   //seed first call and store interval (to clear later)
  var interval = setInterval(function() {
    	//each loop, call passed in function
      delegate(array[i]);
      
        //increment, and if we're past array, clear interval
      if (i++ >= array.length - 1)
          clearInterval(interval);
  }, delay)
  
}

ArrayPlusDelay(['x','y','z'], function(obj) {console.log(obj)},1000)

3* Geheime Vierte Option (Beste)

Optionen 1 & 2 sind riskant, denn sobald man sich auf den Weg, die Bahn, es gibt keine Möglichkeit, es zu nennen die Straße hinab (speichern, schließen des Browsers). Wenn man ein großes array oder eine schwere Last in Ihrem delegieren, es wäre schön, einige Rückgriff, wenn Sie es brauchen. Durch speichern der Referenz von setInterval wir haben ständigen Zugriff auf die iterierende Funktion. Wir müssen einfach nur zurück die Intervall-Objekt oben und speichern Sie es, wenn Sie unser array plus delay-Funktion.

JS:

function ArrayPlusDelay(array, delegate, delay) {
  var i = 0
  
   //seed first call and store interval (to clear later)
  var interval = setInterval(function() {
    	//each loop, call passed in function
      delegate(array[i]);
      
        //increment, and if we're past array, clear interval
      if (i++ >= array.length - 1)
          clearInterval(interval);
  }, delay)
  
  return interval
}

var inter = ArrayPlusDelay(['x','y','z'], function(obj) {console.log(obj)},1000)

Dann, wenn wir jemals wollen, um es klar später auf, werfen diese in die Konsole ein:

clearInterval(inter);

Alle 3 Demos in jsFiddle

Ähnlich Wie Stack Overflow Fragen:

• Mit settimeout() mit einer Schleife
• Das Durchlaufen von Arrays mit Zeitverzögerung
• Schleife über array aber mit einer zeitlichen Verzögerung

each ist in der Regel besser für die Dinge, die passieren, sofort.

Statt, wenn Sie don ' T mind ändern der array, können Sie es verwenden, wie eine Warteschlange:

var ary = ['kevin', 'mike', 'sally'];

setTimeout(function loop() {
    console.log(ary.shift());

    if (ary.length)
        setTimeout(loop, 5000);
}, 5000);

Er hält an der Berufung loop 5 Sekunden in die Zukunft, bis es nichts mehr in der Warteschlange.