js 串行执行期约

用数组和 for 循环再包装一下就是:

async function randomDelay(id) {
// 延迟 0~1000 毫秒
const delay = Math.random() * 1000;
return new Promise((resolve) => setTimeout(() => {
    console.log(`${id} finished`);
    resolve();
  }, delay));
}
async function foo() {
  const t0 = Date.now();
const promises = Array(5).fill(null).map((_, i) => randomDelay(i));
  for (const p of promises) {
    await p;
}
  console.log(`${Date.now() - t0}ms elapsed`);
}
foo();
// 4 finished
// 2 finished
// 1 finished
// 0 finished
// 3 finished
// 877ms elapsed

注意，虽然期约没有按照顺序执行，但 await 按顺序收到了每个期约的值:

async function randomDelay(id) {
// 延迟 0~1000 毫秒
const delay = Math.random() * 1000;
return new Promise((resolve) => setTimeout(() => {
    console.log(`${id} finished`);
    resolve(id);
}, delay)); }
async function foo() {
  const t0 = Date.now();
const promises = Array(5).fill(null).map((_, i) => randomDelay(i));
  for (const p of promises) {
    console.log(`awaited ${await p}`);
}
  console.log(`${Date.now() - t0}ms elapsed`);
}
foo();
// 1 finished
// 2 finished
// 4 finished
// 3 finished
// 0 finished
// awaited 0
// awaited 1
// awaited 2
// awaited 3
// awaited 4
// 645ms elapsed

如何串行执行期约并把值传给后续的期约。使用 async/await，期约连锁会变 得很简单:

function addTwo(x) {return x + 2;}
function addThree(x) {return x + 3;}
function addFive(x) {return x + 5;}
async function addTen(x) {
  for (const fn of [addTwo, addThree, addFive]) {
    x = await fn(x);
}
return x; }
addTen(9).then(console.log); // 19

这里，await 直接传递了每个函数的返回值，结果通过迭代产生。当然，这个例子并没有使用期约， 如果要使用期约，则可以把所有函数都改成异步函数。这样它们就都返回期约了: 8

async function addTwo(x) {return x + 2;}
async function addThree(x) {return x + 3;}
async function addFive(x) {return x + 5;}
async function addTen(x) {
  for (const fn of [addTwo, addThree, addFive]) {
    x = await fn(x);
  }
return x; }
addTen(9).then(console.log); // 19