Vytvořte pauzu uvnitř smyčky while v Javascriptu

Chtěl bych vytvořit pauzu uvnitř while smyčku, abych mohl vytvořit n animace, z nichž každá se objeví 3 sekundy po druhé.

Zkoušel jsem následující, ale nefunguje to. Rád bych, aby mi někdo ukázal, co dělám špatně.

i=0;
while (i < n) {
    someanimation();
    setTimeout(function(){
        i++;
    }, 3000);
     
};

Odpověď

setTimeout nezastaví se; požádá Javascript, aby později spustil nějaký jiný kód.

Vyhledání „setTimeout loop“ vám řekne přesně to, co potřebujete vědět. Když se trochu rozhlédnete, zmiňuje dokonce setInterval. Rozdíl:použití setTimeout pro smyčku počká 3 sekundy mezi smyčkami, zatímco setInterval způsobí, že smyčka bude trvat celkem 3 sekundy (včetně toho, jak dlouho trvá animace, pokud je kratší než 3 sekundy 🙂 ). SetInterval také vytváří nekonečnou smyčku, ze které se budete muset vymanit po požadovaném počtu opakování; setTimeout vyžaduje, abyste vytvořili smyčku sami.

i = 0;

function animation_loop() {
  someAnimation();
  setTimeout(function() {
    i++;
    if (i < n) {
      animation_loop();
    }
  }, 3000);
};
animation_loop();

i = 0;
someAnimation();
setInterval(function() {
  i++;
  if (i < n) {
    someAnimation();
  }
}, 3000);