一尘不染

setTimeout如何才能按顺序运行

javascript

我有两个for 循环,在其中我有setTimeout函数,如下代码:

for(let i=0;i<3;i++){
    setTimeout(()=>{console.log(i)}, 1000)
}
for(let i=0;i<3;i++){
    setTimeout(()=>{console.log(i)}, 1000)
}

我希望在第一个循环完成后才执行第二个循环,

I want this result:
0
1
2
0
1
2
- and between 2 numbers wait 1 second.

我怎么能这样做?


阅读 95

收藏
2022-07-26

共1个答案

一尘不染

我还不能发表评论,或者我会问一些澄清问题,所以我会给你我认为你想要的东西。如果您希望每个数字记录到控制台之间有 1 秒的延迟,那么这将起作用:

const func = async () => {
  for (let i = 0; i < 3; i++) {
    await new Promise((resolve) =>
      setTimeout(() => {
        console.log(i);
        resolve();
      }, 1000)
    );
  }
  for (let i = 0; i < 3; i++) {
    await new Promise((resolve) =>
      setTimeout(() => {
        console.log(i);
        resolve();
      }, 1000)
    );
  }
};

func();

快速了解这里发生的事情。我创建了一个名为异步的外部函数func,以便可以在其中使用 await 关键字。然后我把setTimeout调用放在一个新的 Promise 实例中。promise 与 await 相结合意味着 javascript 将基本上停止在该行,直到 Promise 调用 resolve。一旦 resolve 被调用,Promise 的实例就完成了,await 语句停止“阻塞”javascript,回调函数继续。TLDR:

  1. 要使用 await 你必须在一个异步函数中。
  2. 如果在 Promise 之前使用 await ,那么一切都会停止,直到 Promise 解决。
  3. 将 promise 的解析放置在给定的回调中,以setTimeout确保我们将等到每次超时结束,然后再开始下一次超时。
2022-07-26