javascript - 当循环在异步函数内部而不是相反时，为什么 Async/Await 可以正常工作？

Question

我有三个片段，在 await promise 时循环三次。

在第一个片段中，它按我预期的那样工作，i 的值随着每个 await 递减。

let i = 3;

(async () => {
  while (i) {
    await Promise.resolve();
    console.log(i);
    i--;
  }
})();

输出:

3
2
1

---

在第二个中，i 的值不断递减，直到为零，然后执行所有的 await。

let i = 3;

while (i) {
  (async () => {
    await Promise.resolve();
    console.log(i);
  })();
  i--;
}

输出:

0
0
0

---

最后，这会导致 Allocation failed - JavaScript heap out of memory 错误并且不打印任何值。

let i = 3;
while (i) {
  (async () => {
    await Promise.resolve();
    console.log(i);
    i--;
  })();
}

---

有人可以解释为什么他们表现出这些不同的行为吗？谢谢。

Answer 1

关于你的第二个片段:

在不等待结果的情况下调用异步函数称为即发即忘。您告诉 JavaScript 它应该开始一些异步处理，但您不关心它何时以及如何完成。就是这样。它循环，触发一些异步任务，当循环完成时，它们会在某个时候完成，并且会在循环已经结束时记录 0。如果你这样做:

await (async () => {
  await Promise.resolve();
  console.log(i);
})();

它将按顺序循环。

关于你的第三个片段:

您永远不会在循环中递减 i，因此循环会一直运行下去。如果异步任务在某个时候执行，它会递减 i，但这不会发生，因为 while 循环疯狂运行并阻塞和崩溃浏览器。

 let i = 3;
 while(i > 0) {
   doStuff();
 }