ECMAScript 2020 中的 Promise.allSettled 方法的使用

阅读时长 4 分钟读完

ECMAScript 2020 中的 Promise.allSettled 方法的使用

在 JavaScript 中,Promise 作为一种异步编程的利器,非常常见。而在 ECMAScript 2020 中,新添加了一个 Promise.allSettled 方法,它在使用多个 Promise 时非常有用。

Promise.allSettled 与 Promise.all 不同,之前的所有 Promise 一旦有一个出现错误,就会直接返回异常,而 Promise.allSettled 则会在所有 Promise 都有结果(无论是成功还是失败)后才会返回结果。这个新方法应用场合较多,本文就来详细介绍其使用方法。

使用语法

Promise.allSettled 返回一个 Promise,它在所有给定的 Promise 都已经 fulfilled 或 rejected 时回调并提供一个对象数组。每个对象都表示与其对应的 Promise 结果。

语法如下:

Promise.allSettled(iterable)

其中,iterable 表示可以迭代的一组 Promise。

返回的结果是一个 Promise 对象,它的状态为 fulfilled。

当所有的 Promise 都成功执行时,返回的结果对象数组的每个元素为:

当任意一个 Promise 失败时,返回的结果对象数组的每个元素为:

使用示例

假设我们有一个用来从服务器获取用户信息的 Promise 对象,并且我们要同时获取多个用户的信息并且在所有用户信息请求完成后进行展示。

在以前,我们可以这样使用 Promise.all 的方法实现:

let promises = [getUserInfo(1), getUserInfo(2), getUserInfo(3)];

Promise.all(promises).then(function(results) { let userInfoList = []; for(var i=0; i< results.length; i++) { userInfoList.push(results[i]); } displayUserInfo(userInfoList); }).catch(function(error) { console.log("Error", error); });

当其中任意一个 Promise 失败时,就会直接返回 error。而如果我们想要在所有 Promise 均已执行后展示用户信息,需要使用 Promise.allSettled 方法。

如下所示:

let promises = [getUserInfo(1), getUserInfo(2), getUserInfo(3)];

Promise.allSettled(promises).then(function(results) { let userInfoList = [];

results.forEach(function(userPromiseResult) { if(userPromiseResult.status === 'fulfilled') { userInfoList.push(userPromiseResult.value); } }); displayUserInfo(userInfoList); }).catch(function(error) { console.log("Error", error); });

上述代码使用 Promise.allSettled 方法来获取每个 Promise 的结果。如果 Promise 成功了,我们将其添加到用户信息列表中;如果失败了,我们就不做处理了。

这样做在实际项目中十分方便,可以处理更多的业务逻辑。而在之前的方法中,如果有一个请求失败了,就需要把最终的列表中的数据进行处理。

总结

ECMAScript 2020 中的 Promise.allSettled 方法让我们在处理多个 Promise 时更加方便,能够在所有 Promise 都已经 fulfilled 或 rejected 时,获取到每个 Promise 的结果,支持对结果的进一步处理。

如果你在编写 JavaScript 代码时需要使用这种处理方式,那么可以尝试使用 Promise.allSettled 这个新的方法,它将大大提高你的编码效率。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64952a9d48841e989426e7cf

纠错
反馈