在 JavaScript 中等待 Promise 时到底会发生什么？

Question

我在文档或相关资源中似乎找不到的一点是，当 JS 按下

await

关键字时，关于调用函数和事件循环的过程是什么。

这是规格的状态：

await 表达式会导致异步函数执行暂停，直到 Promise 得到解决（即履行或拒绝），并在履行后恢复异步函数的执行。恢复时，await 表达式的值是已履行的 Promise 的值。

这一切都有道理，但是暂停到底是什么意思呢？该函数是否立即返回给调用者，然后当正在等待的 Promise 解析时，它和异步方法的其余部分会被添加到微任务队列中进行处理吗？我知道

async/await

是 Promise API 的语法糖，所以我假设这就是所发生的情况，但我想确保我真正理解达到

await

时发生的“魔法” 。

从我读到的内容来看，这似乎是在 C# 中完成的，但我不太确定它是如何转换为 JS 的。

Answer 1

正如你所说，它把剩下的功能放到一个微任务Q中，继续主功能。

然后，当 Promise 解析时，它执行异步部分。

帮助我理解的是，将 async/await 转换为 Promise 语法，然后就清楚了。

例如：

async function doSomthing() {
  someSync();

  const result1 = await someAsync();
  const result2 = await someAsync2();

  return result1 + result2;
}

“转换”为：

function doSomthing() {
  someSync();

  return someAsync().then(result1 => {
    return someAsync2().then(result2 => {
      return result1 + result2;
    });
  });
}

你可以看到

doSomthing

立即返回了promise。

Answer 2

await/async 意味着我们同步执行代码。它将遵循 async 函数内调用await 函数的顺序。 例如：它将逐行处理执行，就像等待从await返回响应一样，然后继续执行。

 `function doubleAfter2Seconds(x) {
    return new Promise(resolve => {
      setTimeout(() => {
        resolve(x * 2);
      }, 2000);
    });
  }

  async function addAsync(x) {
     console.log("Here I am before first await"); 
    const a = await doubleAfter2Seconds(10);
    console.log("A ouput is ",a);
    const b = await doubleAfter2Seconds(20);
    console.log("B ouput is ",b);
    const c = await doubleAfter2Seconds(30);
    console.log("C ouput is ",c);
    return x + a + b + c;
  }


  addAsync(10).then((sum) => {
    console.log(sum);
  });`

上面的代码将输出如下结果：

希望这有助于理解异步/等待