用async-await实现类似Promise.all()的执行效果

原创于 2018-02-06 11:04:16 发布 · 5.7k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #异步

经验技巧专栏收录该内容

31 篇文章

订阅专栏

本文介绍了一个用于并行执行多个异步函数的方法 awaitAll，并通过示例展示了如何使用该方法实现函数的并行执行，最终在指定时间内获得所有函数的执行结果。

使用函数：

awaitAll(fn1, fn2, fn3...)

async function awaitAll(...fnArr) {
  if ({}.toString.call(fnArr[0]) === '[object Array]') {
    fnArr = fnArr[0];
  }
  const fnNum = fnArr.length;
  const promiseArr = [];
  const resultArr = [];
  for (let i = 0; i < fnNum; i++) {
    promiseArr.push(fnArr[i]());
  }
  for (let i = 0; i < fnNum; i++) {
    resultArr.push(await promiseArr[i])
  }
  return resultArr;
}

测试：

function wait(ms) {return new Promise(resolve => setTimeout(() => resolve(), ms));}

async function fn1() {
  await wait(1000);
  console.log('fn1');
  await wait(1000);
  return 'fn1';
}

async function fn2() {
  await wait(3000);
  console.log('fn2');
  return 'fn2';
}

async function fn3() {
  console.log('fn3');
  await wait(2000);
  return 'fn3';
}

function fn4() {
  console.log('fn4');
  return 'fn4';
}

awaitAll(fn1, fn2, fn3, fn4).then(results => {
  console.log(results);
});
// 在3秒后，返回结果列表