ECMAScript 2020 新特性:Promise.all() 与 Promise.allSettled()

在 JavaScript 中,Promise 是处理异步操作的重要方式。在 ECMAScript 2020 中,Promise.all() 和 Promise.allSettled() 是两个值得称赞的新特性,它们都是用于处理多个 Promise 对象的。

Promise.all()

Promise.all() 方法接收一个 Promise 对象的数组作为参数,并且返回一个新的 Promise 对象。当所有的 Promise 对象都变为 fulfilled 状态时,返回的 Promise 对象才会变成 fulfilled 状态,此时它的值是一个对象数组,依次对应传入的每个 Promise 对象的值。如果其中任意一个 Promise 对象变成 rejected 状态,则返回的 Promise 对象会立刻变为 rejected 状态,并且它的值为被拒绝的那个 Promise 对象的值。

下面是一个示例:

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

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

输出结果:

-----

此时,所有 Promise 对象的状态都变为了 rejected,因此 Promise.all() 返回的结果也是一个 rejected 状态。

Promise.allSettled()

Promise.allSettled() 方法也接收一个 Promise 对象的数组作为参数,并且返回一个新的 Promise 对象。当所有的 Promise 对象都变为 fulfilled 或 rejected 状态时,返回的 Promise 对象才会变成 fulfilled 状态,此时它的值是一个对象数组,每个对象表示每个 Promise 对象的状态和值。

下面是一个示例:

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

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

输出结果:

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

由于 promise2 被拒绝了,因此它的状态为 rejected,而其他 Promise 对象的状态都为 fulfilled。

总结

Promise.all() 和 Promise.allSettled() 方法都是用于处理多个 Promise 对象的,它们都可以将多个

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/664440b9d3423812e42227c7


猜你喜欢

  • 用 TypeScript 构建可维护的 Angular 应用程序

    Angular 是一款流行的前端框架,它提供了强大的功能和工具,使得开发者能够快速构建可扩展的应用程序。而 TypeScript 则是一种强类型的 JavaScript 超集,它提供了更好的代码组织和...

    5 个月前
  • 如何为 PWA 开发合适的 manifest.json 文件

    什么是 PWA PWA(Progressive Web App)是一种新型的 Web 应用程序,它结合了 Web 应用程序和原生应用程序的优点。PWA 可以像原生应用程序一样离线访问,具有快速加载速度...

    5 个月前
  • ES10 中新增的 String。prototype。trimStart() 和 String。prototype。trimEnd() 方法

    在ES10的新特性中,新增了两个方法——String.prototype.trimStart() 和 String.prototype.trimEnd(),它们分别用于去除字符串的开头和结尾的空格。

    5 个月前
  • ES9 中的 Object.fromEntries():简单解决对象转换问题

    在前端开发中,我们经常需要将一个对象转换为另一个对象,比如将一个数组转换为对象,或者将一个 Map 转换为对象。在 ES9 中,新增了一个 Object.fromEntries() 方法,可以方便地将...

    5 个月前
  • Kubernetes 部署 Java 应用总是出现 OutOfMemory 错误的解决方案

    问题描述 在使用 Kubernetes 部署 Java 应用程序时,有时会出现 OutOfMemory 错误。这个问题可能会导致应用程序崩溃或无法正常运行,给生产环境带来严重影响。

    5 个月前
  • SPA 应用中的数据缓存方案

    随着 Web 技术的不断发展,越来越多的网站开始采用 SPA(Single Page Application)技术来实现页面的动态加载和交互。而在 SPA 应用中,数据缓存是一个非常重要的问题。

    5 个月前
  • Promise 中的 catch 和 then 的差别及最佳实践

    在前端开发中,我们经常会使用 Promise 来处理异步操作。而在 Promise 中,catch 和 then 是两个常用的方法,它们的作用都是用于处理 Promise 的状态变化。

    5 个月前
  • Babel 7.5 之后,我们不再需要 babel-preset-env

    前言 在前端开发中,我们经常需要使用 Babel 来将 ES6+ 的代码转换成 ES5 的代码,以兼容不支持 ES6+ 的浏览器。而在 Babel 的配置中,我们通常会用到 babel-preset-...

    5 个月前
  • 如何在 Hapi.js 中集成 Swagger 文档

    Swagger 是一个流行的 API 文档生成工具,它可以帮助开发者自动生成 API 文档,方便其他开发者使用和理解接口。在 Hapi.js 中集成 Swagger 文档可以提高接口的可读性和可维护性...

    5 个月前
  • 在 Mocha 和 Chai 中如何 Mock 数据?

    在前端开发中,测试是一个非常重要的环节。在测试过程中,Mock 数据是非常有用的。Mock 数据可以帮助我们在测试时模拟出真实场景中的数据,从而更好地测试我们的代码。

    5 个月前
  • SPA 应用中的路由优化策略

    单页应用(Single Page Application,SPA)已经成为了现代 Web 开发中不可或缺的一部分。在 SPA 中,路由(Routing)是一个重要的概念,它负责将用户的 URL 映射到...

    5 个月前
  • 从 React 到 Next.js 的 Headless CMS 管理指南

    在现代 Web 开发中,Headless CMS 已经成为了一种趋势。它解耦了内容管理和前端展示,让前端开发者可以更加专注于用户界面和交互体验的设计。在这篇文章中,我们将介绍如何使用 React 和 ...

    5 个月前
  • Serverless 架构:如何使用 Lambda Layers 来分离共享代码?

    Serverless 架构是一种新型的云计算架构,它的核心思想是将所有的后端服务都交由云服务商来管理。这种架构的优势在于它可以让开发者更加专注于业务逻辑,而不需要关注底层的服务器和网络架构。

    5 个月前
  • 教你如何使用 Redux 调试 Chrome 插件

    前言 Redux 是一种用于 JavaScript 应用程序的可预测状态容器,它可以帮助我们管理应用程序的状态并使得状态变化可追溯。而 Chrome 插件是一种浏览器扩展,它可以通过 JavaScri...

    5 个月前
  • 前端单元测试利器 Enzyme

    什么是 Enzyme? Enzyme 是一个用于 React 应用程序的 JavaScript 测试实用程序库。它允许您更轻松地测试 React 组件的输出,使您能够对组件进行深度渲染、模拟用户交互和...

    5 个月前
  • Sass 中使用 css 选择器、@media 查询、:hover、+ 等样式

    介绍 Sass 是一种 CSS 预处理器,它扩展了 CSS 语言,提供了许多便利的功能,使得编写 CSS 变得更加简单、高效和可维护。本文将介绍 Sass 中如何使用 CSS 选择器、@media 查...

    5 个月前
  • 使用 aria-readonly 属性实现无障碍可读性

    在前端开发中,我们不仅要关注网站的外观和交互效果,还要考虑到无障碍可读性,以确保网站能为所有用户提供平等的使用体验。本文将介绍如何使用 aria-readonly 属性实现无障碍可读性,为有视觉障碍的...

    5 个月前
  • 如何调试 SPA 应用中的跨域问题

    单页面应用(SPA)已成为现代 Web 开发的主流方式之一,但是由于安全原因,Web 浏览器会限制跨域资源的访问。在开发 SPA 应用时,经常会遇到跨域问题,本文将介绍如何调试 SPA 应用中的跨域问...

    5 个月前
  • PWA 在移动端 Web 应用的实践应用

    随着移动设备的普及,Web 应用在移动端的使用越来越广泛。但是,由于网络环境的不确定性和设备性能的局限性,移动端 Web 应用的用户体验往往不如原生应用。这时候,PWA(Progressive Web...

    5 个月前
  • Express.js 和 Bootstrap 实现网站快速开发

    前言 在前端开发中,网站的快速开发是非常重要的。为了实现快速开发,我们可以使用一些流行的框架和库。在本文中,我们将介绍如何使用 Express.js 和 Bootstrap 快速开发网站。

    5 个月前

相关推荐

    暂无文章