我如何从 promise 链移动到 async/await 多个 promise?

How do I move from promise chaining to async/await multiple promises?

我搜索了很多,尝试了很多,但我无法得出明确的结论。我链接了很多 Promise:

getInstalledComponents().call().then(response => {
    return {
        'installed_components': {
            'data': response
        }
    };
}).then((passed_data) => {
    return getDemosCategories().call().then(response => {
        return {...passed_data, ...{'demos_categories': response}};
    });
}).then((passed_data) => {
    return getDemosData().call().then(response => {
        return {...passed_data, ...{'demos_data': response}};
    });
}).then((passed_data) => {
});

我无法处理这个错误。我想以这样一种方式重写它,如果其中一个失败,所有这些都应该失败并且 return.

我试过asy/await每个promise函数,一无所获。 return 我需要的数据的承诺是 getInstalledComponents, getDemosCategories, getDemosData 并且每个承诺都是基于承诺的 AJAX 调用。当AJAX调用回来时基本解决了。

这看起来不干净,也没有用。我如何重写它以满足我的要求?

如果您只是在最后一个 then 的末尾放置一个 catch 块,它会捕获任何函数中的错误。

Promise.reject("firstFailed")
  .then(passedData => console.log("second") || passedData)
  .then(passedData => console.log("third")  || passedData)
  .then(passedData => console.log("fourth") || passedData)
  .catch(error => console.error(error));

从上面示例中缺少控制台日志可以看出,第一个拒绝会停止执行任何其他 then

利用 Promise.all 我们能够并行化请求:

Promise.all([
  getInstalledComponents().call(),
  getDemosCategories().call(),
  getDemosData().call()
])
.then(([installedComponents, demosCategories, demosData]) => ({
  "installed-categories": { data: installedComponents },
  "demos-categories": { data: demosCategories },
  "demos-data": {data: demosData}
}))
.catch(e => handleSomeErrorForAnyOfRequestsAbove(e))

使用async/await还需要Promise.all:

const result = {};
try {
  const [installedComponents, demosCategories, demosData] = await 
    Promise.all([
      getInstalledComponents().call(),
      getDemosCategories().call(),
      getDemosData().call()
    ]);
  result["installed-components"] = installedComponents;
  result["demos-categories"] = demosCategories;
  result["demos-data"] = demosData;

} catch(e) {
  handleSomeErrorFromAnyOfRequestFailed();
}