ECMAScript 2018(ES9)中 Promise.prototype.finally() 方法使用注意事项

在 ECMAScript 2018(ES9)中,Promise 对象新增了一个 finally() 方法,用于指定不管 Promise 对象最终状态如何都会执行的操作。该方法可以帮助我们更好地处理异步操作中的错误和异常情况。在本文中,我们将详细介绍 Promise.prototype.finally() 方法的使用注意事项,并提供示例代码以帮助读者更好地理解。

Promise.prototype.finally() 方法的语法

Promise.prototype.finally() 方法的语法如下:

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

其中,promise 是一个 Promise 对象,onFinally 是一个函数,用于指定 Promise 对象最终状态时要执行的操作。

Promise.prototype.finally() 方法的使用注意事项

1. Promise.prototype.finally() 方法的返回值

Promise.prototype.finally() 方法返回一个新的 Promise 对象,该 Promise 对象的状态和值与原来的 Promise 对象一致。如果 onFinally 函数返回一个 Promise 对象,那么新的 Promise 对象的状态和值将与该 Promise 对象一致。

2. Promise.prototype.finally() 方法的执行时机

Promise.prototype.finally() 方法的 onFinally 函数在 Promise 对象最终状态时执行,即 Promise 对象的状态变为 fulfilled 或 rejected 时都会执行。

3. Promise.prototype.finally() 方法的错误处理

如果 onFinally 函数抛出一个错误,那么新的 Promise 对象的状态将变为 rejected,并且该错误将作为新的 Promise 对象的 reason 值。

4. Promise.prototype.finally() 方法的参数传递

Promise.prototype.finally() 方法的 onFinally 函数不接受任何参数,因为它只是用于指定最终状态时要执行的操作。

示例代码

下面是一个使用 Promise.prototype.finally() 方法的示例代码,该代码用于从服务器获取数据并显示在页面上:

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

在上述代码中,我们首先使用 fetch() 方法从服务器获取数据,并通过 Promise 链式调用处理响应结果。如果响应状态不是 200 OK,我们将抛出一个错误并在页面上显示错误消息。最后,我们使用 Promise.prototype.finally() 方法指定一个函数,用于在 Promise 对象最终状态时隐藏加载动画。

总结

在本文中,我们介绍了 ECMAScript 2018(ES9)中 Promise.prototype.finally() 方法的使用注意事项,并提供了示例代码以帮助读者更好地理解。使用 Promise.prototype.finally() 方法可以帮助我们更好地处理异步操作中的错误和异常情况,并提高代码的可读性和可维护性。

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


猜你喜欢

  • 如何解决 TypeError: Cannot convert undefined or null to object 错误

    在前端开发中,经常会遇到 TypeError: Cannot convert undefined or null to object 错误,这个错误通常是因为我们试图将一个 undefined 或 n...

    7 个月前
  • 使用 TailwindCSS 优雅的画出图标 - 最佳实践

    在前端开发中,图标是一个非常重要的元素。在过去,我们通常使用图片或字体图标来实现这个功能。但是,随着技术的不断发展,现在有更加优雅的方式来实现图标,那就是使用 TailwindCSS。

    7 个月前
  • 理解 CSS Reset 对网站性能的影响

    在前端开发中,CSS Reset 是一个常用的技术,它可以重置浏览器默认的样式,以达到统一样式的目的。然而,CSS Reset 对网站性能也有一定的影响。本文将从多个方面详细探讨 CSS Reset ...

    7 个月前
  • 在 Koa 中使用 Nginx 实现反向代理的实现方法

    在开发前端应用时,我们经常需要使用反向代理来解决跨域问题、负载均衡等问题。Nginx 是一款高性能的反向代理服务器,而 Koa 是一款轻量级的 Node.js Web 框架。

    7 个月前
  • Promise 中常见错误排查方法大盘点

    前言 在前端开发中,Promise 是一种常用的异步编程解决方案,它可以有效地解决回调地狱的问题,提高代码的可读性和可维护性。但是,Promise 中也存在一些常见的错误,本文将介绍这些错误的排查方法...

    7 个月前
  • 在 Cypress 代码中使用 ES6 语法

    Cypress 是一款现代化的前端测试工具,它提供了简单易用的 API 和强大的断言库,使得编写和运行测试变得更加容易和高效。同时,Cypress 也支持使用 ES6 语法编写测试代码,这让我们在编写...

    7 个月前
  • 多页面项目中如何使用 Webpack 提升开发效率

    前言 在前端开发中,我们经常会遇到多页面的项目,这样的项目需要在不同的页面中使用不同的 JavaScript、CSS 文件,同时还需要对这些文件进行打包、压缩等操作。

    7 个月前
  • ES12 标准下的 JavaScript 模块导入与导出详解

    前言 在前端开发中,模块化是一种非常重要的开发方式。通过模块化,我们可以将一个复杂的应用程序分解为多个小的、独立的、可复用的模块,从而提高代码的复用性、可维护性和可扩展性。

    7 个月前
  • 使用 Fastify 框架,如何解决 CORS 跨域问题?

    什么是 CORS 跨域问题? CORS(Cross-Origin Resource Sharing)是一种浏览器安全机制,用于限制跨域请求。跨域请求是指在浏览器中,一个页面的 JavaScript 代...

    7 个月前
  • 使用 Server-Sent Events 实现监控系统

    在前端开发中,监控系统是非常重要的一部分。它可以帮助我们实时监控网站的运行状态,及时发现问题并解决。常见的监控系统有各种各样的工具,但是这些工具都需要在后端处理数据并将其发送到前端。

    7 个月前
  • 在 Deno 中使用 REST API 开发微服务

    随着互联网技术的不断发展,微服务架构已经成为了现代软件开发中的一种重要方式。微服务架构可以将一个大型的应用拆分成多个小型的服务,每个服务都可以独立部署和升级,从而提高了应用的可扩展性和可维护性。

    7 个月前
  • 使用 Docker Compose 部署多个容器时遇到的几个问题及解决方式

    前言 在现代化的开发模式中,使用容器化技术已经成为了必不可少的一环。Docker Compose 是 Docker 官方提供的一个工具,可以帮助我们快速地定义并启动多个容器。

    7 个月前
  • 使用 Headless CMS 实现个性化推荐系统

    在现代 Web 应用中,个性化推荐系统已经成为了一个非常重要的功能。通过分析用户的行为和偏好,系统可以根据用户的兴趣推荐相关的内容,提高用户的满意度和粘性。 而 Headless CMS 则是近年来非...

    7 个月前
  • 如何避免 Babel 编译过程中出现循环依赖问题

    在前端开发中,我们经常会使用 Babel 来将 ES6+ 的代码转换为兼容性更好的 ES5 代码。但是,在使用 Babel 进行编译的过程中,我们可能会遇到循环依赖的问题,导致代码无法正常编译。

    7 个月前
  • Sequelize 中如何使用 JSON 数据类型字段

    在开发 Web 应用程序时,我们通常需要存储一些非结构化的数据,例如用户的偏好设置、购物车中的商品等。在 Sequelize 中,我们可以使用 JSON 数据类型字段来存储这些数据。

    7 个月前
  • 利用 Flexbox 布局实现常见的布局方式

    Flexbox 是 CSS3 中新增的一种布局方式,它可以帮助我们快速、灵活地实现各种常见的布局方式。本文将介绍 Flexbox 布局的基本概念、常见的布局方式以及实现方法,并提供示例代码供读者参考。

    7 个月前
  • ECMAScript 2015(ES6)的迭代协议与许多功能的简化

    ECMAScript 2015(ES6)是 JavaScript 的一次重大更新,它引入了许多新的语法和功能,其中迭代协议是一个非常重要的改进。本文将详细介绍迭代协议的概念、用法以及它带来的许多功能的...

    7 个月前
  • 在 Node.js 中使用 Async 和 Await 处理异步任务

    在 Node.js 中,异步任务是非常常见的,比如读取文件、发送网络请求等等。在过去,我们通常使用回调函数来处理异步任务,但是回调函数嵌套过多,代码可读性差,维护成本高等问题也逐渐浮现出来。

    7 个月前
  • Jest Cucumber:使用 Gherkin 和 Cucumber 进行测试

    在前端开发中,测试是一个非常重要的环节。而使用 Jest 和 Cucumber 这两个工具,可以更加方便地进行测试。本文将介绍如何使用 Jest 和 Cucumber 进行测试,以及如何使用 Gher...

    7 个月前
  • ES8 惊喜产品:async 方法小白学习笔记

    ES8 中引入了 async 方法,它是一种异步编程的方式,可以使我们更加方便地处理异步操作。对于前端开发者来说,async 方法是必须掌握的知识点之一。本文将为大家介绍 async 方法的基本概念、...

    7 个月前

相关推荐

    暂无文章