在 ES9 中,Promise 对象新增了一个非常实用的方法——finally()。它可以在 Promise 完成时(无论是 resolve 还是 reject)执行一段代码,而不管 Promise 成功或失败都必须执行的逻辑,类似于 try...catch...finally 中的 finally 块。
为什么需要 finally() 方法
在处理异步操作时,经常需要在本次操作完成后清理资源或执行其他必要的操作。在 Promise 出现之前,我们可能使用回调函数来处理异步操作,但回调函数嵌套层数很容易就越来越深,导致代码可读性和可维护性变差。而 Promise 则可以通过链式调用解决这个问题,使多个异步操作更加清晰。
但即使使用了 Promise,我们还需要处理一些异常情况,比如资源清理、日志记录等,这些操作需要在 Promise 完成后执行。在 ES6 中,我们可以使用 then() 方法来处理 Promise 执行结束后的逻辑,但 then() 方法只能在 Promise 成功后执行回调函数,无法处理 Promise 失败后的操作。而 finally() 方法则能够在 Promise 完成时执行一段代码,不管是成功还是失败。
finally() 方法的语法和参数
finally() 方法和 then() 方法一样,也是一个实例方法。它的语法如下:
promise .finally(onFinally)
其中,onFinally 是一个回调函数,它在 Promise 完成时被执行,无论是成功还是失败。onFinally 回调函数不接受任何参数,其返回值也会被忽略。
finally() 方法的使用示例
让我们看一下 finally() 方法的使用示例。假设我们有一个异步函数,它会从服务器获取一些数据,我们需要在获取数据前显示“加载中”的提示,获取数据后隐藏提示。同时,无论获取数据成功还是失败,我们都需要在控制台记录一条日志。
-- -------------------- ---- ------- -------- --------- - ------------------------------------------------ - -------- ------ --------------------------------- -------------- -- ---------------- ----------- -- - ------------------------------------------------ - ------- -------------------- ----------- --- -
在这个例子中,我们使用了 fetch() 拉取数据,并在 Promise 完成时隐藏“加载中”提示和输出一条日志。无论 Promise 成功还是失败,finally() 方法都会在 Promise 执行结束后被调用。
finally() 方法的错误处理
在 Promise 执行时,如果发生了异常(比如网络请求失败),finally() 方法也会被调用。但通常情况下,我们需要在 Promise 失败时执行一些特定的错误处理逻辑。既然 finally() 不能区分 Promise 是成功还是失败,那么我们需要结合 catch() 方法来处理 Promise 失败的情况。
-- -------------------- ---- ------- -------- --------- - ------------------------------------------------ - -------- ------ --------------------------------- -------------- -- ---------------- ------------ -- - -------------------- --------- ------- -- ----------- -- - ------------------------------------------------ - ------- -------------------- ----------- --- -
在这个例子中,如果 fetch() 中的网络请求失败了,catch() 方法会将错误传递给 console.error()
方法进行处理。而 finally() 方法总是会被执行,无论 Promise 是否失败。
总结
Promise.finally() 方法是一项非常实用的功能,它可以在 Promise 完成(resolve 或 reject)后执行一段逻辑,不管 Promise 成功还是失败。使用 finally() 方法可以更方便地完成资源清理、日志记录等必要的操作。在处理 Promise 异常时,需要结合 catch() 方法来实现特定的错误处理逻辑。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64aa2e3248841e98946594d6