javascript - 在同一个异步函数/定时器重置中使用多个setTimeout

Question

这个问题已经有答案了:

Waiting for more than one concurrent await operation (4 个回答)

已关闭 5 年前。

当尝试理解 async/await 时，我尝试了这段代码，但它的行为与我预期的不同。

let test = async function () {
  let result = new Promise((resolve, reject) => {
    setTimeout(() => resolve('done1'), 2000)
  })

  let result2 = new Promise((resolve, reject) => {

    setTimeout(() => resolve('done2'), 2500)
  })

  let x1 = await result
  console.log(x1)


  let x2 = await result2
  console.log(x2)

}

test()

我期望控制台在 2 秒后显示 done1，然后在 did1 后 2.5 秒显示 done2。相反，它在 2 秒内显示完成 1，并在 0.5 秒后显示完成 2。为什么它的行为是这样的，因为我在显示第一个 setTimeout 之后等待第二个 setTimeout？

Answer 1

当您创建新的 Promise 时，它开始运行其代码。当你在其中设置 setTimeout 时，实际上计时器正在运行。当您在 Promise 调用之前使用 await 时，它会等到 Promise 得到解决或拒绝后才开始工作。

您需要创建每个 Promise，然后等待它。

let test = async function () {

  let result = new Promise((resolve, reject) => {
    setTimeout(() => resolve('done1'), 2000);
  });
  
  let x1 = await result;
  console.log(x1);

  let result2 = new Promise((resolve, reject) => {
    setTimeout(() => resolve('done2'), 2500);
  });

  let x2 = await result2;
  console.log(x2);

}

test()