setTimeout如何才能按顺序运行

小编典典

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.

我怎么能这样做？

阅读 106

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：

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

2022-07-26