【Promise】掌握 Promise.all并行处理异步操作
Promise.all
Promise.all
是 JavaScript 中 Promise 对象的一个静态方法。它接受一个可迭代的 Promise 对象(如数组),并返回一个新的 Promise 对象。这个新的 Promise 对象在所有输入的 Promise 对象都成功完成时才会成功,如果任何一个 Promise 对象失败,则立即失败。
基本用法
const promise1 = Promise.resolve(1);
const promise2 = Promise.resolve(2);
const promise3 = Promise.resolve(3);
Promise.all([promise1, promise2, promise3])
.then((values) => {
console.log(values); // 输出: [1, 2, 3]
})
.catch((error) => {
console.error(error);
});
在这个例子中,Promise.all
接收一个包含三个 Promise 对象的数组,并在所有 Promise 都成功完成后,返回一个包含所有结果的数组。
处理异步操作
Promise.all 在处理多个异步操作时非常有用。
const fetchDataFromApi1 = fetch('https://api.example.com/data1').then(response => response.json());
const fetchDataFromApi2 = fetch('https://api.example.com/data2').then(response => response.json());
const fetchDataFromApi3 = fetch('https://api.example.com/data3').then(response => response.json());
Promise.all([fetchDataFromApi1, fetchDataFromApi2, fetchDataFromApi3])
.then(([data1, data2, data3]) => {
console.log('Data from API 1:', data1);
console.log('Data from API 2:', data2);
console.log('Data from API 3:', data3);
})
.catch((error) => {
console.error('Error fetching data:', error);
});
在这个例子中,我们并行地从三个不同的 API 端点获取数据,并在所有数据都成功返回后进行处理。
错误处理
Promise.all
的一个关键特性是,如果任何一个 Promise 失败,整个 Promise.all
就会失败。这使得错误处理变得非常简单:
const promise1 = Promise.resolve(1);
const promise2 = Promise.reject(new Error('Something went wrong'));
const promise3 = Promise.resolve(3);
Promise.all([promise1, promise2, promise3])
.then((values) => {
console.log(values); // 不会执行到这里
})
.catch((error) => {
console.error(error); // 输出: Error: Something went wrong
});
在这个例子中,由于 promise2
失败,Promise.all
立即进入 catch
块,并捕获到 promise2 的错误。
实际应用场景
- 批量上传文件
假设你需要上传多个文件到服务器,可以使用 Promise.all 来并行处理这些上传操作:
const uploadFile = (file) => {
return fetch('https://api.example.com/upload', {
method: 'POST',
body: file
}).then(response => response.json());
};
const files = [file1, file2, file3];
Promise.all(files.map(file => uploadFile(file)))
.then((results) => {
console.log('All files uploaded successfully:', results);
})
.catch((error) => {
console.error('Error uploading files:', error);
});
- 并行执行多个定时任务
假设你需要在特定时间点执行多个定时任务,可以使用 Promise.all 来并行处理这些任务:
const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));
const task1 = delay(1000).then(() => console.log('Task 1 done'));
const task2 = delay(2000).then(() => console.log('Task 2 done'));
const task3 = delay(3000).then(() => console.log('Task 3 done'));
Promise.all([task1, task2, task3])
.then(() => {
console.log('All tasks completed');
})
.catch((error) => {
console.error('Error executing tasks:', error);
});
原文地址:https://blog.csdn.net/m0_71975585/article/details/140608856
免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!