为什么我们应该将 Promise 对象存储在变量中？

Question

让我们假设我们有一个函数可以解决如下所示的承诺：

function timeoutPromise(interval) {

  return new Promise((resolve, reject) => {

    setTimeout(function(){

      resolve("done");

    }, interval);

  });

};

让我们假设我们以两种不同的方式在异步函数中调用该函数；

慢速同步方式：

async function timeTest() {

  await timeoutPromise(3000);

  await timeoutPromise(3000);

  await timeoutPromise(3000);

}

这里我们只是直接等待所有三个 timeoutPromise() 调用。随后的每个任务都被迫等待直到最后一个任务完成，这将导致总运行时间约为 9 秒。

和快速异步方式：

async function timeTest() {

  const timeoutPromise1 = timeoutPromise(3000);

  const timeoutPromise2 = timeoutPromise(3000);

  const timeoutPromise3 = timeoutPromise(3000);

  await timeoutPromise1;

  await timeoutPromise2;

  await timeoutPromise3;

}

在这里，我们将三个 Promise 对象存储在变量中，这会导致它们的关联进程全部同时运行。这将导致总运行时间约为 3 秒。

但问题是，为什么将 Promise 对象存储在变量中会导致相关进程同时运行？幕后发生了什么？

Answer 1

await foo(); await bar();仅在解决了返回的 Promise后才会调用bar（从而创建第二个 Promise）。foovar x = foo(); var y = bar(); await x;在解决返回的承诺之前调用bar（从而创建第二个承诺） 。foo这就是承诺“同时”的原因。如果您在不同的地方添加，console.log您将看到执行上的差异：function timeoutPromise(name, interval) {  return new Promise((resolve, reject) => {    console.log(`Promise ${name} created.`);    setTimeout(function(){      console.log(`Promise ${name} resolved.`);      resolve("done");    }, interval);  });};async function timeTest1() {  console.log('test 1');  await timeoutPromise(1, 3000);  console.log('between promise 1 and 2');  await timeoutPromise(2, 3000);}async function timeTest2() {  console.log('test 2');  const timeoutPromise1 = timeoutPromise(1, 3000);  console.log('between promise 1 and 2');  const timeoutPromise2 = timeoutPromise(2, 3000);  await timeoutPromise1;  console.log('between promise 1 and 2 with await');  await timeoutPromise2;}timeTest1().then(timeTest2);