在前端开发中，异步流程控制是非常重要的一部分，因为很多操作都需要等待异步操作完成后才能进行下一步操作。Promise.all() 是一个非常有用的方法，它可以将多个 Promise 对象合并成一个 Promise 对象，从而方便地进行异步流程控制。
Promise.all() 的基本用法
Promise.all() 接收一个 Promise 对象数组作为参数，并返回一个新的 Promise 对象。这个新的 Promise 对象在所有的 Promise 对象都完成后才会被 resolve，如果其中任何一个 Promise 对象被 reject，那么这个新的 Promise 对象就会被 reject。
下面是 Promise.all() 的基本用法：
// www.javascriptcn.com code example
const promise1 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('promise1');
}, 1000);
});
const promise2 = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('promise2');
}, 2000);
});
Promise.all([promise1, promise2])
.then(([result1, result2]) => {
console.log(result1, result2); // 'promise1' 'promise2'
})
.catch((error) => {
console.error(error);
});上面的代码中，Promise.all() 接收了一个包含 promise1 和 promise2 的数组作为参数，然后在所有的 Promise 对象都完成后，通过解构赋值获取了它们的结果，并打印出来。
Promise.all() 的深度应用
除了基本用法之外，Promise.all() 还有很多深度应用。下面我们来看几个例子。
并行请求多个接口
在前端开发中，经常需要同时请求多个接口，然后将它们的结果合并起来。使用 Promise.all() 可以非常方便地实现这个功能。
// www.javascriptcn.com code example
const fetchUsers = fetch('/api/users');
const fetchPosts = fetch('/api/posts');
const fetchComments = fetch('/api/comments');
Promise.all([fetchUsers, fetchPosts, fetchComments])
.then(([response1, response2, response3]) => {
return Promise.all([response1.json(), response2.json(), response3.json()]);
})
.then(([users, posts, comments]) => {
console.log(users, posts, comments);
})
.catch((error) => {
console.error(error);
});上面的代码中，我们使用 fetch() 方法请求了三个不同的接口，并将它们的 Promise 对象放入了一个数组中。然后通过 Promise.all() 方法等待它们都完成后，再将它们的结果解析为 JSON 对象，并打印出来。
串行执行多个异步操作
有时候我们需要依次执行多个异步操作，而且要保证它们的执行顺序。这时候可以使用 Promise.all() 方法和 async/await 结合起来，实现串行执行多个异步操作的效果。
// www.javascriptcn.com code example
async function doSomething() {
const result1 = await asyncFunc1();
const result2 = await asyncFunc2();
const result3 = await asyncFunc3();
return [result1, result2, result3];
}
doSomething()
.then(([result1, result2, result3]) => {
console.log(result1, result2, result3);
})
.catch((error) => {
console.error(error);
});上面的代码中，我们定义了一个 doSomething() 函数，它依次执行了三个异步操作，并将它们的结果存入一个数组中返回。然后在调用 doSomething() 函数时，通过 Promise.all() 方法等待它们都完成后，再将它们的结果解构出来并打印出来。
Promise.all() 的指导意义
Promise.all() 是一个非常有用的方法，它可以帮助我们方便地进行异步流程控制。在实际开发中，我们经常需要同时请求多个接口，或者依次执行多个异步操作，而 Promise.all() 可以帮助我们实现这些功能。
同时，使用 Promise.all() 也可以提高代码的可读性和可维护性。因为它可以将多个 Promise 对象合并成一个 Promise 对象，避免了嵌套的回调函数，使代码更加简洁明了。
最后，需要注意的是，Promise.all() 方法会等待所有的 Promise 对象都完成后才会执行后续操作。如果其中任何一个 Promise 对象被 reject，那么 Promise.all() 方法就会立即返回 reject，并且不会等待其他 Promise 对象完成。因此，在使用 Promise.all() 方法时，需要确保所有的 Promise 对象都能正确地完成。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67d4783ea941bf7134877d41