快和慢的await 原创邦

快和慢的await

await 后面直接是promise, 那后面的代码被阻止，需要等promise执行完fulfill

await 后面的是变量，变量又指向了promise，那么这个promise就不会block后面的代码。（这一点容易混淆，也有点不容易理解）他们差别在哪里呢？

另外Promise.all([p1, p2, p3]) 这里面的p1、p2、p3也是不会阻塞的。和await快的情况一致。

相当越是， await 是一个线程，如果await 直接调用一个 promise ，那就在 await线程里面做。如果await调用的是个变量，“调用”这个事情也在current thread里面做，变量指向了一个promise，那就表示是异步里面的异步，那就不能被阻塞，因为都安排出去了。就好像老板安排了三个人去分别去做三件事一样，就不是老板自己做了。

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await#handling_asyncawait_slowdown

fast

async function timeTest() {
  const timeoutPromise1 = timeoutPromise(3000);
  const timeoutPromise2 = timeoutPromise(3000);
  const timeoutPromise3 = timeoutPromise(3000);

  await timeoutPromise1;
  await timeoutPromise2;
  await timeoutPromise3;
}

slow

async function timeTest() {
  await timeoutPromise(3000);
  await timeoutPromise(3000);
  await timeoutPromise(3000);
}

Promise.all([]) -fast

      const timeoutPromise1 = timeoutPromise(3000);
      const timeoutPromise2 = timeoutPromise(3000);
      const timeoutPromise3 = timeoutPromise(3000);
      const timeTest =       Promise.all([timeoutPromise1, timeoutPromise2, timeoutPromise3])


      let startTime = Date.now();
      timeTest.then(() => {
        let finishTime = Date.now();
        let timeTaken = finishTime - startTime;
        alert("Time taken in milliseconds: " + timeTaken);
      })

The Promise.all() rejects when any of the input promises are rejected. If you want all the promises to settle and then use some of their fulfilled values, even when some of them are rejected, you could use Promise.allSettled() instead.

上面的后两种在reject的处理过程中是不同的

这个其中一个reject，别的还会继续运行。

function timeoutPromiseResolve(interval) {
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      resolve("successful");
    }, interval);
  });
};

function timeoutPromiseReject(interval) {
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      reject("error");
    }, interval);
  });
};

async function timeTest() {
  const timeoutPromiseResolve1 = timeoutPromiseResolve(5000);
  const timeoutPromiseReject2 = timeoutPromiseReject(2000);
  const timeoutPromiseResolve3 = timeoutPromiseResolve(3000);

  await timeoutPromiseResolve1;
  await timeoutPromiseReject2;
  await timeoutPromiseResolve3;
}

let startTime = Date.now();
timeTest().then(() => {
}).catch(e => {
  console.log(e);
  let finishTime = Date.now();
  let timeTaken = finishTime - startTime;
  alert("Time taken in milliseconds: " + timeTaken);
})

Promise.all 中任何一个reject，那么就都中止了

function timeoutPromiseResolve(interval) {
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      resolve("successful");
    }, interval);
  });
};

function timeoutPromiseReject(interval) {
  return new Promise((resolve, reject) => {
    setTimeout(function(){
      reject("error");
    }, interval);
  });
};

async function timeTest() {
  const timeoutPromiseResolve1 = timeoutPromiseResolve(5000);
  const timeoutPromiseReject2 = timeoutPromiseReject(2000);
  const timeoutPromiseResolve3 = timeoutPromiseResolve(3000);

  const results = await Promise.all([timeoutPromiseResolve1, timeoutPromiseReject2, timeoutPromiseResolve3]);
  return results;
}

let startTime = Date.now();
timeTest().then(() => {
}).catch(e => {
  console.log(e);
  let finishTime = Date.now();
  let timeTaken = finishTime - startTime;
  alert("Time taken in milliseconds: " + timeTaken);
})

阅读量: 614
发布于: 2021-10-11
修改于: 2021-10-11