在 JavaScript 中,Promises 一直都是异步操作的代表。在 Promise 成功或失败后,可以使用 then() 与 catch() 处理其结果,而 finally 块的作用是即使 Promise 成功或失败也会被执行,通常用于清理或释放资源。 ES9(ECMAScript 2018)推出了 Promises.prototype.finally 方法,它使得 finally 块的使用更加方便和可读性更好。
Promises.prototype.finally
Promises.prototype.finally 方法可以以链式调用的方式返回原始 Promise,即在 finally 块被执行之后,返回的 Promise 将与原始 Promise 的状态相同。 它的语法如下:
promise.finally(onFinally)
其中,promise 是一个 Promise 实例, onFinally 是一个回调函数,且无论原始 Promise 被成功还是失败,都会被调用。
优化代码的替代方案
对于以下代码段:
doSomething().then(function () { return doSomethingElse(); }).catch(function (error) { console.log(error); }).finally(function () { cleanUp(); });
这段代码执行成功后,doSomethingElse() 就会被调用。如果执行失败,则错误信息将被记录在控制台上。无论哪种情况,cleanUp() 方法都会在最后执行。现在,你可以使用 Promises.prototype.finally 方法优化这些代码:
doSomething().then(function () { return doSomethingElse(); }).catch(function (error) { console.log(error); }).finally(cleanUp);
使用 Promises.prototype.finally 方法,cleanUp 方法不需要被返回,而是直接传递。这使得代码更加简洁易读。
使用 Promises.prototype.finally 的示例代码
下面是一个使用 Promises.prototype.finally 的示例代码,它封装了 FileReader,读取给定文件中的文本并在代码执行完毕后关闭文件:
-- -------------------- ---- ------- -------- -------------- - ------ --- ---------------- --------- ------- - --- ------ - --- ------------- ------------- - -------- -- - ----------------------- -- -------------- - -------- -- - --------------------- -- ------------------------ --- - -------- --------------- - ----------------- ------------ -- --------- - --- --------- - --------------------------------------------- ------------------------------------------ -------- - -------------------- ----------------- ------- - ------------------- ------------------- -- - ------------------------------ ---
在此示例中,readFile() 方法读取所选的文件并解析其文本内容,然后在执行完该异步任务后调用 finally (closeFile) 关闭文件句柄。 Promises.prototype.finally 方法确保在任务完成后始终关闭文件,无论是成功还是失败。
结论
在本文中,我们介绍了 Promises.prototype.finally 方法的用法,以及如何使用它来代替 JavaScript 中原生的 finally 块。 Promises.prototype.finally 方法不仅可以优化代码执行,而且可以减少代码的语法复杂度,提高其可读性。 我希望通过这篇文章,您已经掌握了 ES9 Promises.prototype.finally 的使用方法,并且能够在您的代码中使用它。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/66f516f5c5c563ced56c5654