npm 包 promise-all-recursive 使用教程

在前端开发中，我们经常需要进行异步处理，而 Promise 是一个非常好用的方式。而当我们需要处理一组 Promise 时，通常可以使用 Promise.all 方法。不过，如果这组 Promise 中包含 Promise 数组嵌套的情况， Promise.all 就不能很好地处理了。而 npm 包 promise-all-recursive 就是为了解决这个问题而生的，它可以递归处理 Promise 数组，让异步处理更加便捷和高效。

promise-all-recursive 简介

Promise.all 方法的常见使用方式如下：

Promise.all([ p1, p2, p3 ])
  .then(([ res1, res2, res3 ]) => {
    console.log(res1);
    console.log(res2);
    console.log(res3);
  });

不过，当 Promise 数组构成树形结构时， Promise.all 就不能直接使用了。比如下面这个例子， Promise 数组 p1 和 p2 都需要等到 Promise 数组 p1.1 和 p1.2 完成才能完成：

const p1 = Promise.all([ p1.1, p1.2 ]);
const p2 = Promise.resolve(42);
Promise.all([ p1, p2 ])
  .then(([ res1, res2 ]) => {
    console.log(res1);
    console.log(res2);
  });

如果使用 promise-all-recursive，上述代码可以简化为：

const p1 = Promise.all([ p1.1, p1.2 ]);
const p2 = Promise.resolve(42);
promiseAllRecursive([ p1, p2 ])
  .then(res => {
    console.log(res);
  });

promise-all-recursive 的使用

安装

使用 npm 安装：

npm install promise-all-recursive

引入

import promiseAllRecursive from 'promise-all-recursive';

示例

下面是一个示例，我们使用 promise-all-recursive 来处理树形结构的 Promise 数组：

const p1 = Promise.all([ p1.1, p1.2 ]);
const p2 = Promise.resolve(42);
promiseAllRecursive([ p1, p2 ])
  .then(res => {
    console.log(res);
  });

其中，p1.1 和 p1.2 都是 Promise 数组，比如：

const p1.1 = Promise.all([ p1.1.1, p1.1.2 ]);
const p1.2 = Promise.resolve(10);

快速入门

下面是一个使用 promise-all-recursive 的快速入门示例，假设我们有下面这个异步过程：

-- -------------------- ---- -------
----- ---- - --- --
  --- --------------- --
    -----------
      -- -- -------------
      ------------- - ----
    -
  --

----- -- - -------------
  --------
  -------
---

----- -- - -------------
  ---------- ----- ---- -- --
    -------------
      ------ - ------
      ------ - -----
    --
  --
  --------
  -------
---

该异步过程中，p1 依赖于 task(1) 和 task(2) 的结果，而 p2 依赖于 p1，task(5) 和 task(6) 的结果。我们可以使用 promise-all-recursive 简化这个异步过程：

const p1 = promiseAllRecursive([ task(1), task(2) ]);

const p2 = promiseAllRecursive([
  () => p1.then(([ res1, res2 ]) =>
    promiseAllRecursive([ task(3 * res1), task(4 * res2) ])),
  task(5),
  task(6)
]);

更多用法

promise-all-recursive 还提供了一些高级用法，比如：

限制并发数

promiseAllRecursive.concurrencyLimit(2);

上述代码表示只允许最多同时进行 2 个异步过程。

暂停和恢复

promiseAllRecursive.pause();
promiseAllRecursive.resume();

上述代码表示暂停和恢复异步过程。

总结

promise-all-recursive 可以递归处理 Promise 数组，让处理异步任务更加方便和高效。在需要处理树形结构的 Promise 数组时，它是非常有用的工具。在实际开发中，我们可以结合 promise-all-recursive 和其它 Promise 工具，如 Promise.race 和 Promise.reject，来优化我们的异步处理过程。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055c2181e8991b448d9bdd