如何使用 ECMAScript 2018 中的 Promise.finally()-JavaScript中文网-JavaScript教程资源分享门户

如何使用 ECMAScript 2018 中的 Promise.finally()

Promise 是 JavaScript 中一种非常重要的技术，它可以用来处理异步数据。ECMAScript 2018 新增的 Promise.finally() 方法，为 Promise 提供了一个最终执行的方法，它可以在 Promise 执行完毕后，无论 Promise 正常执行还是报错，都会执行该方法，来进行一些善后处理工作。

在本文中，我们将详细讲解如何使用 Promise.finally() 方法来优化我们的前端开发。

Promise.finally() 方法的语法

Promise.finally() 方法有以下语法：

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

promise：必选，要执行该方法的 Promise 实例。
onFinally：必选，Promise 执行结束后，要执行的回调函数。

onFinally 回调函数不接收任何参数，也不能修改 Promise 的状态。

Promise.finally() 方法的示例代码

下面是一个使用 Promise.finally() 方法的示例代码：

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

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

在上面的代码中，我们使用了 setTimeout 函数模拟一个异步操作，然后使用 Promise 对象返回执行结果。执行过程中，我们通过 .then() 方法和 .catch() 方法来处理 Promise 的成功和失败，最后使用 .finally() 方法来处理无论如何都会执行的情况。

使用 Promise.finally() 的实际应用

1. 关闭 loading 状态

当我们在前端开发中发起一个异步请求时，一般都需要在开始时打开一个 loading 状态，表示正在加载中，等数据加载完成再将 loading 状态关闭。这时，我们可以使用 finally() 方法来关闭 loading 状态。

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

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

2. 存储请求结果

当我们需要将异步请求返回的数据存储到本地存储中时，我们可以在 .then() 方法中存储，在 .finally() 方法中完成一些善后工作。

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

3. 清空表单数据

当我们使用表单提交数据时，提交成功后一般需要将表单中的数据清空，让用户可以继续输入数据。这时，我们可以在 .finally() 方法中清空表单数据。

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

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

总结

Promise.finally() 是 ECMAScript 2018 引入的新特性，它为 Promise 提供了一个最终执行的方法，能够让我们进行一些善后处理工作。在实际开发中，我们可以使用 .finally() 方法来关闭某些状态、存储请求结果、清空表单数据等操作。

来源：JavaScript中文网，转载请联系管理员！本文地址：https://www.javascriptcn.com/post/64c767ae10032fedd39159c5