前言
在日常开发中，很多时候我们需要同时发出多个请求，这样就需要考虑如何处理多个请求的并发情况。传统的回调函数很难解决并发请求的问题，而 Promise 则在这方面有着独特的优势，本文将介绍 Promise 如何解决并发请求的问题。
Promise 简介
Promise 是 ECMAScript 6 中新增的一种处理异步操作的机制，它可以看作是回调函数的一种更强大的替代方案。Promise 有三种状态：待定（pending）、已完成（fulfilled）和已拒绝（rejected）。当 Promise 从待定状态转变为已完成或已拒绝状态时，就称为 Promise 被“解决（settled）”了。
在 Promise 中，我们可以使用 then() 方法来注册两个回调函数，分别对应 Promise 被解决时的成功情况和失败情况。如下所示：
const promise = new Promise((resolve, reject) => {
// 异步操作，处理成功调用 resolve，处理失败调用 reject
});
promise.then(onFulfilled, onRejected);如果 Promise 被解决时是成功的情况，则 onFulfilled 函数会被调用，如果是失败的情况，则 onRejected 函数会被调用。
Promise 的并发请求
在实际开发中，我们经常需要同时发出多个请求来获取相关的数据，当多个请求同时返回时，我们需要对这些数据进行一些处理，这就需要 Promise 实现并发请求。
我们可以使用 Promise.all() 方法来实现这个目的。Promise.all() 接受一个 Promise 数组作为参数，如果数组中的所有 Promise 都被成功解决，则 Promise.all() 返回一个新的 Promise 对象，该 Promise 对象会解决为一个由所有 Promise 返回值组成的数组。如果数组中任意一个 Promise 被拒绝，则 Promise.all() 返回的 Promise 对象会立即被拒绝，并且 Promise 对象的 catch() 方法会被调用。
下面是一个使用 Promise.all() 来处理并发请求的实例：
// javascriptcn.com 代码示例
const requestUrls = [
'https://www.example.com/api/user/1',
'https://www.example.com/api/user/2',
'https://www.example.com/api/user/3',
];
const requests = requestUrls.map(url => fetch(url).then(response => response.json()));
Promise.all(requests).then(data => {
console.log(data); // data 为所有请求数据的数组
}).catch(error => {
console.error(error); // 处理请求出错的情况
});在上面的代码中，我们首先定义了一个请求 URL 数组 requestUrls，然后使用 fetch() 方法来获取每个 URL 对应的数据。fetch() 方法返回一个 Promise 对象，该对象在成功时会解决为一个 Response 对象，我们可以使用 Response 对象中的 json() 方法来解析请求返回的数据。
我们使用 Array.prototype.map() 方法来遍历 requestUrls 数组，将每个 URL 转换为一个 Promise 对象，并将这些 Promise 对象保存在 requests 数组中。将 requests 数组传递给 Promise.all() 方法，当所有 Promise 都被成功解决时，我们使用 then() 方法来处理返回的所有数据。
总结
Promise 机制提供了一种更好的解决方式来处理并发请求。我们可以使用 Promise.all() 方法来并发处理请求，获得更高效的运行性能。同时，Promise 还可以帮助我们更好地设计和处理异步操作，避免传统回调函数带来的问题。
如果你还没有使用 Promise 机制，那么赶快学习和掌握它，可以帮助你更好地应对现代 Web 开发中的异步操作需求。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6538e7617d4982a6eb2104f6