使用 ES8 中的 promise.finally() 为每个异步请求添加 finally 处理程序

阅读时长 3 分钟读完

在前端开发中,我们经常会遇到异步请求的情况,比如通过 Ajax 请求获取数据或者通过 Promise 等方式进行异步操作。有时候我们需要在请求结束后执行一些处理操作,例如清空表单、隐藏加载中的提示等等。在过去,我们可能需要在每个异步请求的 then() 方法中都添加一个处理操作,这样会使得代码冗余和不易维护。但是在 ES8 中,我们可以使用 promise.finally() 方法,为每个异步请求添加一个 finally 处理程序,从而更加简洁和优雅地处理异步请求。

promise.finally() 方法介绍

promise.finally() 方法是 ES8 中新增加的 Promise 方法。该方法返回一个 Promise 对象,在 Promise 对象执行结束后无论是 fulfilled 还是 rejected,都会执行 finally 处理程序。

promise.finally() 方法的语法:promise.finally(onfinally)

其中,onfinally 是一个函数,用来指定 finally 处理程序。

promise.finally() 方法示例代码

下面是一个使用 promise.finally() 方法的例子:

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

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

在上面的例子中,我们使用 asyncFunc() 方法进行异步请求,并在 then() 方法和 catch() 方法中分别处理请求结果和错误。在 finally() 方法中,我们可以添加需要在请求结束后执行的处理程序。

promise.finally() 方法的应用场景

在实际开发中,我们可能会遇到这样的情况:需要在请求结束后无论是否出错都需要进行一些操作,比如清空表单、隐藏加载中的提示。使用 promise.finally() 方法可以帮助我们更加优雅地完成这些操作。

下面是一个例子,展示使用 promise.finally() 方法清空表单的情况:

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

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

在上面的例子中,我们使用 asyncFormSubmit() 方法进行表单提交,并在 then() 方法和 catch() 方法中分别处理请求结果和错误。在 finally() 方法中,我们清空表单,这样不管请求成功或者失败,表单都将被清空。

结论

使用 promise.finally() 方法可以为每个异步请求添加一个 finally 处理程序,从而更加简洁和优雅地处理异步请求。该方法可以帮助我们在请求结束后执行清空表单、隐藏加载中的提示等操作,使得代码更加易维护和统一。

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

纠错
反馈