【前端】使用Promise达到循环调用接口的效果

Promise.all()

要使用Promise.all调用同一个异步方法多次并将所有结果收集起来,你可以创建一个包含该方法调用的Promise数组,然后将这个数组传递给Promise.all。示例:

假设你有一个异步方法fetchData(id),你想针对一组ID调用它并等待所有结果。

javascript 复制代码
async function fetchData(id) {
    // 这里是你的异步操作,比如API调用
    // 示例中使用setTimeout模拟延迟
    return new Promise((resolve) => {
        setTimeout(() => {
            resolve(`Data for ID ${id}`);
        }, 1000);
    });
}

// ID列表
const ids = [1, 2, 3, 4, 5];

// 使用map遍历ID列表,为每个ID调用fetchData方法,并收集所有的Promise
const promises = ids.map(id => fetchData(id));

// 使用Promise.all等待所有Promise完成
Promise.all(promises)
    .then(results => {
        console.log("所有请求的结果:", results);
    })
    .catch(error => {
        console.error("其中一个请求失败:", error);
    });

Promise.all会等待所有Promise完成(不论是成功还是失败)。当所有Promise都解决(resolve)时,.then()会被调用,并且会接收一个数组,其中包含了所有Promise解决的结果。如果有任何Promise被拒绝(reject),.catch()会立即被调用,且后续的Promise不会再执行。

相关推荐
啃火龙果的兔子8 小时前
地图gis开发前置工作
前端
明月_清风8 小时前
IndexedDB 增量更新:实现精准的字段级“补丁”
前端·indexeddb
kylezhao20198 小时前
C#中 Invoke、begininvoke、InvokeRequired的详细讲解和三者之间的区别
开发语言·c#
zheshiyangyang8 小时前
前端面试基础知识整理【Day-10】
前端·面试·职场和发展
bubiyoushang8888 小时前
基于遗传算法的LQR控制器最优设计算法
开发语言·算法·matlab
明月_清风8 小时前
浏览器里的 SSD:IndexedDB 极简封装实战
前端·indexeddb
2301_796512528 小时前
【精通篇】打造React Native鸿蒙跨平台开发高级复合组件库开发系列:Pagination 分页(绑定当前页码)
javascript·react native·react.js·ecmascript·harmonyos
谢尔登8 小时前
深入React19任务调度器Scheduler
开发语言·前端·javascript
hoiii1878 小时前
MATLAB中LSSVM工具包及简单例程详解
开发语言·matlab
长城20248 小时前
HTML5中表单的pattern属性解析
前端·正则表达式·html·html5·pattern·pattern属性·pattern正则表达式