javascript - 在 Javascript 中的 while 循环内创建暂停

Question

我想在 while 中创建一个暂停循环，以便我可以创建 n动画，每一个在另一个之后出现 3 秒。
我尝试了以下方法，但它不起作用。希望有人告诉我我做错了什么。

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

Answer 1

setTimeout不暂停；它要求 Javascript 稍后运行一些其他代码。
谷歌搜索“setTimeout loop”会告诉你你需要知道什么。如果你环顾四周，它甚至会提到 setInterval。区别:使用 setTimeout 循环将在循环之间等待 3 秒，而 setInterval 将使循环总共需要 3 秒(包括动画花费的时间，只要它少于 3 秒 :) )。此外， setInterval 构造了一个无限循环，您必须在所需的次数后退出该循环； setTimeout 需要您自己构建循环。

i = 0;

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

// setInterval approach
i = 0;
someAnimation();
iid = setInterval(function() {
  i++;
  if (i < n) {
    someAnimation();
  } else {
    clearInterval(iid);
  }
}, 3000);