在 ES2018 和 ES2019 中使用 Promise.prototype.finally() 优雅地处理异步业务逻辑-JavaScript中文网-JavaScript教程资源分享门户

在 ES2018 和 ES2019 中使用 Promise.prototype.finally() 优雅地处理异步业务逻辑

异步编程是前端开发中不可避免的一部分，而 Promise 则是处理异步操作的重要手段之一。在 ES2018 和 ES2019 中，Promise 也得到了进一步的增强，其中 Promise.prototype.finally() 方法就是一项非常实用的功能。本文将详细介绍 Promise.prototype.finally() 的使用方法及其在实际开发中的应用。

1、 Promise.prototype.finally() 的基本用法

Promise.prototype.finally() 方法是 Promise 原型对象的一个新方法，它接受一个函数作为参数，并在 Promise 完成时被调用，无论 Promise 的状态是成功还是失败都会被执行。它的基本用法如下所示：

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

其中，promise 表示一个 Promise 对象，onFinally 则是一个函数，它会在 Promise 的状态发生变化时被执行。

接下来我们通过一个简单的实例来了解 Promise.prototype.finally() 方法的具体用法：

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

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

上述代码中，我们创建了一个 Promise 对象 readFile()，在该对象中我们模拟了一个异步操作并在 1 秒钟后返回一个错误信息。接着我们对该 Promise 对象进行了处理，当它成功时输出 "Read file success"，当它失败时输出对应的错误信息，最后在任何情况下都输出 "File reading completed"。

2、Promise.prototype.finally() 的具体应用

在实际开发中，Promise.prototype.finally() 方法可以用来处理一些异步操作的业务逻辑，例如：在发起网络请求时显示请求状态，无论请求成功或者失败都要隐藏请求状态等等。

下面我们通过一个简单的网络请求实例来了解具体的应用方法：

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

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

上述代码中，我们定义了一个 fetchData() 函数用来发起网络请求，在该函数中，我们使用 fetch() 方法获取数据，并在请求成功时处理数据，请求失败时处理错误信息，并在请求完成后隐藏请求状态。

由于 Promise.prototype.finally() 在无论 Promise 的状态是成功还是失败都会被执行，因此在 fetchData() 函数中无论成功与否都会触发隐藏请求状态的操作，从而提高了代码的复用性和可维护性。

3、Promise.prototype.finally() 的注意事项

在使用 Promise.prototype.finally() 方法时需要注意以下几点：

.finally() 并不会改变 Promise 的状态和传递数据。
.finally() 中不能直接操作 Promise 对象的返回值，如果需要修改返回值，则应该返回一个新的 Promise 对象。
.finally() 中不能抛出错误，否则会影响后续的 Promise 链式调用。

下面是一些常见的错误用法：

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

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

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

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

4、总结

在 ES2018 和 ES2019 这两个版本中，Promise.prototype.finally() 方法是开发者比较期待的一项功能。该方法能够让我们更优雅地处理异步业务逻辑，有效提高了代码的复用性和可维护性。

然而，在使用 Promise.prototype.finally() 的时候，我们也需要注意一些细节，避免出现一些常见的使用错误。

最后，我们可以在实际开发中灵活应用 Promise.prototype.finally() 方法，增强代码的可读性和可维护性，并提高开发效率和代码质量。

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