随着前端应用的复杂,异步操作已经成为开发中必不可少的一部分。对于异步操作,我们通常使用 Promise 来处理回调和执行顺序。但有时候我们需要同时处理多个异步操作,并且有些操作是可选的,如果其中一个异步操作出错,整个异步操作链都会中断。这时候,ECMAScript 2019 中提供的 Promise.allSettled 方法就变得非常有用。
Promise.allSettled 方法简介
Promise.allSettled 方法的作用是接收一个 Promise 数组,在所有的 Promise 都被 settled(fulfilled 或 rejected)之后才返回结果,不管其中任何一个 Promise 的状态是 fulfilled 还是 rejected。并且,Promise.allSettled 方法返回一个新的 Promise,该 Promise 的 resolved 值是一个数组,每个元素对应着传入的 Promise 数组的每个 Promise 对象。
Promise.allSettled 方法的语法如下:
----------------------------
其中,iterable 表示一个可迭代的对象,例如数组。
Promise.all 和 Promise.allSettled 的区别
对于经常使用 Promise 的开发者,可能很容易将 Promise.all 和 Promise.allSettled 混淆。它们都可以并行地执行多个异步操作,并在所有的操作完成后返回一个 Promise 对象。但是,它们的返回值和成功条件有所不同。
Promise.all 方法会在所有的 Promise 对象都成功后才返回一个 resolved 的 Promise 对象,返回值是一个数组,包含了所有 Promise 对象完成的结果。如果其中一个 Promise 对象失败,就会立即返回一个 rejected 的 Promise 对象。
相比之下,Promise.allSettled 方法会在所有的 Promise 对象都 settled(无论是成功还是失败)之后返回一个 resolved 的 Promise 对象,返回值是一个数组,每个元素对应着传入的 Promise 数组的每个 Promise 对象,包括它们的执行结果(fulfillment value)或拒绝原因(rejection reason)。
Promise.allSettled 方法的示例
下面是一个 Promise.allSettled 方法的示例,我们通过读取不同的文件,将它们的内容转化为 JSON,然后拼接在一起,并打印结果。
----- -- - ----------------------- ----- -------- - ----- ---------- -- - --- - ----- ---- - ----- --------------------- -------- ------ ----------------- - ----- ----- - -------------------- ------- ---- -------------- ----- ------ ----- - -- -------------------- ----------------------- ----------------------- ----------------------- ---------------------- ----------------- -- - ----- ---- - -------------------- -- - -- -------------- --- ------------ ------ ------------- ---- ------ ----- ------------------- ---------------- ----- ---- ---------------- ----------------------------- -------------- -- - -------------------- ------- -------- ----- ---
上面的代码:
使用 fs.promises 模块读取不同的文件,然后使用 try-catch 代码块来捕获读取文件的异常,如果出现异常,则返回 null,默认情况下,Promise.allSettled 会将这个操作视为失败。
使用 Promise.allSettled 方法并将所有的读取操作作为参数传入。
对结果数组进行处理,清除所有失败的操作,并将成功的操作的结果转化为数组。
将数组拼接在一起,然后输出结果。
总结
Promise.allSettled 方法为前端开发带来了更丰富、更灵活的异步编程方式。我们可以同时执行多个异步操作,并根据结果进行相应的处理。不再需要担心某个异步操作失败会导致整个异步操作链中断。希望这篇文章能够帮助你更好地理解 Promise.allSettled 方法的使用方法,从而提升你的前端开发技能。
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/652249e395b1f8cacd9b2dd1