随着 JavaScript 的发展,Promise 成为了开发 Web 应用程序中最重要的几个新功能之一。Promise 允许我们轻松地处理异步请求和响应,这在大多数 Web 应用程序中都是必需的。而在 ECMAScript 2019 中,我们看到了一个新的 promise 方法:promise.finally() 。这个方法允许开发人员在 promise 结束时执行一组代码,无论是否成功或失败。这是一个强大的功能,特别是当您正在尝试处理长时间运行或有死角的 Web 应用程序时。
执行一组代码
promise.finally() 方法允许开发人员在 promise 结束时执行一段代码。这意味着无论 promise 成功还是失败,都将执行这段代码。这个方法旨在添加一个处理程序来释放所有编写异步代码时未清理的资源。这比你自己处理边缘情况和未清理的资源要好得多。
下面是一个简单的例子,其中 promise 完成后,我们打印一个消息来告知开发人员:
--------------------------------------- -------------- -- ---------------- ----------- -- - ------------------ ----------- ---
在这个例子中,我们使用 fetch() API,它返回一个 promise。在成功完成 JSON 响应之后,我们添加一个 finally() 代码块,它在 fetch 请求完成后执行。不管请求成功与否,都将执行这段代码。
处理 finally() 中的参数
promise.finally() 方法还可以接受一个回调函数作为参数。这个函数将在任何情况下都会被调用,并且能够接收 promise 之前的结果传递进来。如果 promise 链发生错误,它也会接收这个错误。
下面是一个例子,其中处理程序将始终被调用,然后根据 promise 是否成功,将结果记录到控制台:
--------------------------------------- -------------- -- ---------------- ----------------- -- - ------------------ -------- ---- --------- -------- ---
在这个例子中,我们的 finally() 方法采用一个结果参数,并记录结果的内容。这是一个简单的例子,但在实际编写 Web 应用程序时,您可能会使用其它方法来记录或处理结果。
finally() 返回一个 promise
promise.finally() 方法还具有在方法执行后返回一个 promise 的效果。这意味着您可以将 finally() 方法放在 promise 链的任何位置,并基于前面的标记来确定该链是失败还是成功。这使您能够轻松地处理任何形式的 promise 状态,并且在需要处理多个状态或者 promise 动画时非常有用。
下面是一个例子,其中我们使用一个 promise.finally() 方法来为我们的链中的其他方法添加 context:
----- ------- - - -- ---- ------- ---- -- -- --------------------------------------- -------------- -- ---------------- ---------- -- -------------- ------------ -- ------------------- ----------- -- - -------------------- --------- --------- ---
在这个例子中,我们添加了一个 catch() 方法来处理所有错误。然后,在 finally() 方法内部,我们记录了上下文信息对象。这可以帮助您了解在发生错误时使用的上下文,以便于更好地调试和修改 Web 应用程序。
结论
promise.finally() 方法是 Web 开发者应该掌握的一项新技能。这个方法允许我们在 promise 完成时执行一组代码,这些代码将在成功或失败的情况下都能得到保证。而且,finally() 方法具有返回一个 promise 的功能,这意味着它可以放在整个 promise 链中,执行前面 promise 的状态检查。
这个方法是一种解决 web 应用程序开发过程中长时间执行、占用资源等问题的强大工具,也帮助我们使我们的代码更为健壮和简洁。
希望这篇文章对您有帮助,如果您想更深入了解 Promise 相关知识,可以深入研究 Promise 相关的接口和语法,这将有助于您开发更牢固、更高效、更健壮的 web 应用程序。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/671c5e4e9babaf620fb07656