在 JavaScript 开发中，Promise 对象是一种非常强大的异步编程方式。而在 Promise 中，Promise.all() 和 Promise.race() 是两个非常重要的方法，本文将会介绍它们的区别，以及在实践中的应用。
Promise.all()
Promise.all() 方法接受一个 Promise 对象数组作为参数，返回一个新的 Promise 对象。它会在所有的 Promise 对象都完成后才执行回调函数，并返回所有 Promise 对象的结果。（Promise.all() 只会返回执行结果数组，不会返回每个结果对应的 Promise）。
下面是一个示例代码：
-- -------------------- ---- ------- ----- -------- - --- ----------------- ------- -- - ------------- -- - ---------------- ---- -- ------ --- ----- -------- - --- ----------------- ------- -- - ------------- -- - ---------------- ---- -- ------ --- ----- -------- - --- ----------------- ------- -- - ------------- -- - ---------------- ---- -- ------ --- ---------------------- --------- ------------------------ -- - -------------------- ---展开代码
输出结果将会是一个数组，包含所有 Promise 执行的结果：
["Promise 1", "Promise 2", "Promise 3"]
Promise.race()
Promise.race() 方法同样接收一个 Promise 对象数组作为参数，返回一个新的 Promise 对象。和 Promise.all() 方法不同的是，只要数组中任意一个 Promise 对象完成（resolve 或 reject），就会执行回调函数，并返回这个 Promise 对象的结果。
下面是一个示例代码：
-- -------------------- ---- ------- ----- -------- - --- ----------------- ------- -- - ------------- -- - ---------------- ---- -- ------ --- ----- -------- - --- ----------------- ------- -- - ------------- -- - ---------------- ---- -- ------ --- ----- -------- - --- ----------------- ------- -- - ------------- -- - --------------- - -------- -- ------ --- ----------------------- --------- ------------------------ -- - -------------------- ---------------- -- - ------------------- ---展开代码
输出结果将会是执行最快的 Promise 对象的结果，即：
Promise 2
应用场景
在实践中，Promise.all() 和 Promise.race() 方法有非常多的应用场景。
Promise.all()
通过使用 Promise.all() 方法，我们可以实现多个异步请求同时执行，并在它们都完成之后统一处理结果。这样，能够大大提高代码的效率和可读性。
比如，我们可以通过以下方式，同时异步请求多个数据接口，并在所有请求完成后统一处理结果：
-- -------------------- ---- ------- ----- ---- - -- -- - ------ --- ----------------- ------- -- - -- --- - ---- --- -- ----- ---- - -- -- - ------ --- ----------------- ------- -- - -- --- - ---- --- -- ----- ---- - -- -- - ------ --- ----------------- ------- -- - -- --- - ---- --- -- -------------------- ------- ---------------------- -- - -- ------ ---展开代码
Promise.race()
通过使用 Promise.race() 方法，我们可以快速获取多个异步请求返回的最先完成的结果。这样，能够大大提高代码的响应速度和用户体验。
比如，我们可以通过以下方式，实现从多个数据源获取数据，并快速返回最先获取到的数据：
-- -------------------- ---- ------- ----- ----------- - -- -- - ------ --- ----------------- ------- -- - -- ---- ---- --- -- ----- ----------- - -- -- - ------ --- ----------------- ------- -- - -- ---- ---- --- -- ----- ----------- - -- -- - ------ --- ----------------- ------- -- - -- ---- ---- --- -- ---------------------------- -------------- ----------------------------- -- - -- ------ ---展开代码
需要注意的是，Promise.race() 方法可能会直接返回一个错误，因此在使用时需要注意错误处理。
总结
本文介绍了 Promise.all() 和 Promise.race() 方法的区别和应用场景，通过使用这两个方法，我们能够更加便捷地处理多个异步请求的问题，提高代码的效率和可读性，并优化用户体验。在实践中，需要根据具体的业务场景和需求，灵活选择使用不同的方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649aa89c48841e98947999fc
