1. 如何使用 Promise.allSettled()判断接口请求完毕
使用 Promise.allSettled() 来判断多个接口请求是否全部完成是非常直观和直接的。
Promise.allSettled() 方法会等待所有的 Promise 对象都完成（无论是成功还是失败），然后返回一个包含每个 Promise 结果的数组。
每个结果对象都包含了 status 属性，可以是 "fulfilled"（成功）或 "rejected"（失败），以及 value 或 reason 属性，分别表示成功或失败时的结果。
下面是一个具体的示例，展示如何使用 Promise.allSettled() 来判断多个接口请求是否全部完成：
1.1. 示例代码
假设我们需要从三个不同的 API 端点获取数据，并在所有请求完成后执行一些操作。
1.1.1. 定义请求函数
首先，定义一个函数来发起请求，并返回一个 Promise 对象。
function fetchAPI(url) {
return fetch(url).then(response => {
if (!response.ok) {
throw new Error(`Request failed with status ${response.status}`);
}
return response.json();
});
}1.1.2. 使用 Promise.allSettled()
接下来，使用 Promise.allSettled() 来等待所有的请求完成。
const apiUrls = [
'https://api.example.com/data1',
'https://api.example.com/data2',
'https://api.example.com/data3'
];
const fetchRequests = apiUrls.map(url => fetchAPI(url));
Promise.allSettled(fetchRequests)
.then(results => {
results.forEach((result, index) => {
if (result.status === 'fulfilled') {
console.log(`Request ${index + 1} succeeded:`, result.value);
} else {
console.error(`Request ${index + 1} failed:`, result.reason);
}
});
// 所有请求完成，可以在这里执行其他操作
console.log('All requests have been processed.');
})
.catch(error => {
console.error('An unexpected error occurred:', error);
});1.2. 代码解释
- 定义请求函数：
- fetchAPI 函数接收一个 URL 参数，使用 fetch 发起请求，并返回一个 Promise。
- 如果请求成功，Promise 会被解析为 JSON 数据。
- 如果请求失败，Promise 会被拒绝，并抛出错误。
- 使用 Promise.allSettled()：
创建一个包含所有请求的数组 fetchRequests。
使用 Promise.allSettled() 等待所有请求完成。
results 数组包含了每个请求的结果对象，其中每个对象都有 status 和 value 或 reason 属性。
根据每个请求的状态，打印成功或失败的信息。
1.3. 总结
通过使用 Promise.allSettled()，你可以确保在所有请求完成之后再执行后续的操作。
这种方法的好处在于它能处理成功和失败的情况，并且提供了每个请求的完整结果，使得你可以根据每个请求的状态来做出相应的处理。
如果你需要在所有请求完成之后执行某些操作，可以将这些操作放在 Promise.allSettled() 的回调函数中。
此外，你还可以根据实际需求调整错误处理逻辑，例如记录错误信息或重新发起失败的请求。
