ES10 中的新特性：Promise.finally() 的使用方法及作用

在过去的几年中， JavaScript 的 Promise 功能已成为许多前端开发者的必备技能之一。ES10 的最新版本引入了 Promise.finally()，这位新成员将进一步提高 Promise API 的功能和可用性。这篇文章将带你深入了解该特性的使用方法及作用，并提供一些示例代码供参考。

Promise.finally() 的作用

Promise.finally() 方法是一个操纵 Promise 链程的方法，它在 Promise 解决或拒绝后执行，不论 Promise 的状态如何，无论 Promise 是否拒绝返回值，这个方法都会执行。该方法通过挂载在 Promise 链程上来执行后续的清理/赋值带有逻辑的代码段。

Promise.finally() 的语法

Promise.finally() 方法无需传递任何参数。它只需按如下方式使用：

promise.finally()

Promise.finally() 返回一个新的 Promise，它记录在 Promise 操作完成时要继续执行的回调。

Promise.finally() 方法的使用实例

下面是一个基本示例，它演示了 Promise.finally() 方法隐藏的功能。

let count= 0;
let success = true;
let promise = new Promise(function(resolve, reject){
    if (success) {
        count++;
        resolve("操作成功");
    } else {
        reject("操作失败");
    }
});

promise.then(function(response){
    console.log("成功后的结果：" + response);
}).catch(function(error){
    console.log("失败后的错误：" + error);
}).finally(function(){
    console.log("Promise 的状态：" + promise.status);
});

在上面的示例中，我们实现了一个简单的 Promise，向其传入两个方法：resolve 和 reject。如果返回成功，则记录一个计数，并向控制台打印一个响应内容，否则抛出错误。而在 finally 回调阶段，控制台记录了 Promise 的状态并执行了最后的发散清理。

Promise.finally() 方法的错误捕捉

如果不需要在 finally 块中抛出一个新的错误，则不需要单独的错误处理程序。Promise.finally() 方法将在最后一次尝试中添加日志记录或断言，如果有错误，则按照捕获错误的方式处理。

Promise.resolve('成功').finally(() => console.log('执行 finally 方法。'));

当代码执行到这一处时，finally 方法就会被执行，并输出“执行 finally 方法。”，这与前文中的示例相同。如果我们在 finally 中抛出了一个新的错误：则会输出新的错误而不是记录一个信息。

Promise.resolve('成功').finally(() => { throw new Error('抛出一个新的错误。') });

如果我们传递一个返回Promise对象的回调函数，则该方法需要在必要的情况下异步执行。如果在 finally 方法中返回改变了原值的新 Promise，则必须为该执行显示地指定它的结果，因为如果没有结果，不会抛出错误。

let promise = Promise.resolve('成功');
promise.finally(() => new Promise((resolve, reject) => {
    setTimeout(() => {
        console.log('延迟执行 finally 方法');
        resolve(promise);
    }, 1000);
}).then(() => console.log('打印适用性的延迟了 Promise.finally 方法')));

Promise.finally() 方法的总结

在 Promise API 中，finally 方法是一个神奇的方法，它不仅使我们可以同步在 Promise 链中执行最终的任务，而且不管 Promise 解决或拒绝，它都会被执行。最重要的是，finally 的返回值会影响 Promise 的结果，因此它可以与 then/catch 处理正确地被适用。希望本文中的内容对你有所帮助。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65952c35eb4cecbf2d963af8