Promise 是 JavaScript 中常用的异步编程工具之一，可以有效地处理异步操作的结果，但它并不容易使用。在 Promise 中，我们常常会使用 Promise.all，Promise.allSettled 和 Promise.race 这三个方法来处理异步操作的结构，本文将深入探究这三种方法的用法，特点和应用场景。
Promise.all
Promise.all 方法接收一个 Promise 数组作为参数，当所有的 Promise 都 resolved 后，会返回一个新的 Promise 对象，其返回结果是所有 Promise 的结果组成的数组。如果有任何一个 Promise 被 rejected，则返回的 Promise 对象会立即被rejected。
例如，我们可以使用 Promise.all 来获取多个数据源中的数据，并将它们合并为一个数组。
------------- ------------------------------------------------------ ----------------------------------------------------- ----------------- -- - ------ ---------------------------------- -- ------------------ ------------ -- - ------------------ -------------- -- - ------------------- ---
在上面的代码中，我们使用了 fetch 函数来获取了两个不同的 JSON 数据，通过 Promise.all 来等待所有请求完成，并使用 map 和 json 函数将响应转换为 JavaScript 对象。最终返回了一个包含两个 JSON 数据对象的数组。
Promise.allSettled
Promise.allSettled 方法接收一个 Promise 数组作为参数，与 Promise.all 不同的是，Promise.allSettled 不关心 Promise 是否被 resolved 或 rejected，并且返回的 Promise 对象总是 resolved，其返回结果是一个包含所有 Promise 对象的 状态和值的数组。
例如，我们可以使用 Promise.allSettled 来获取两个数据源的数据，并打印出它们的状态和值。
-------------------- ------------------------------------------------------ ----------------------- --- ------- --------------- -- - --------------------- -------------- -- - ------------------- ---
在上面的代码中，我们使用了 Promise.resolve 来创建了一个立即 resolved 的 Promise 对象，这个 Promise 对象的结果是一个带有 title 属性的对象。 与 fetch API 返回的 Promise 对象不同，即使 Promise.resolve() 在第二个位置，也不会阻止 promise.allSettled 返回确认值和所有resolve的值。
Promise.race
Promise.race 方法接收一个 Promise 数组作为参数，返回第一个完成的 Promise 对象，不关心它是 resolve 还是 reject。
例如，我们可以使用 Promise.race 来获取两个数据源的数据，并返回第一个完成的 Promise 对象。
-------------- ------------------------------------------------------ --- ----------------- ------- -- ------------- -- ------------------ ------ ---------------- -- - ---------------------- -------------- -- - ------------------- ---
在上面的代码中，我们将一个 Promise resolve 和一个 Promise reject 在 Promise.race 中进行比较。由于 Promise.race 只关心第一个完成的 Promise，所以当第二个 Promise 1000ms 后 reject 时，就会被立即返回 reject 值，“timeout”。
总结
Promise.all、Promise.allSettled 和 Promise.race 都是常用的 Promise 方法。但是需要注意的是，这些方法的使用场景和细节各不相同。Promise.all 适用于需要等待多个异步操作完成的场景，Promise.allSettled 适用于需要处理多个异步操作结果的场景，Promise.race 适用于只需要获取最快异步操作结果的场景。正确使用这些方法可以帮助我们更好地处理异步操作，提高网站的性能和稳定性。
示例代码
------------- ------------------------------------------------------ ----------------------------------------------------- ----------------- -- - ------ ---------------------------------- -- ------------------ ------------ -- - ------------------ -------------- -- - ------------------- --- -------------------- ------------------------------------------------------ ----------------------- --- ------- --------------- -- - --------------------- -------------- -- - ------------------- --- -------------- ------------------------------------------------------ --- ----------------- ------- -- ------------- -- ------------------ ------ ---------------- -- - ---------------------- -------------- -- - ------------------- ---
参考链接：
MDN Promise.all
MDN Promise.allSettled
MDN Promise.race
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6654172cd3423812e48af3e1