解决for循环中异步请求顺序不一致的问题
程序员文章站
2022-04-17 19:09:28
...
解决for循环中异步请求顺序不一致的问题
工作中遇到一个问题
for循环,再把循环出来的ID再进行二次请求
这就导致一个问题
请求结果返回顺序不一致
原因:异步请求会把回调事件放入微任务事件队列,宏任务执行完毕再执行微任务,具体参考事件队列机制
【相关课程推荐:JavaScript视频教程】
解决方法:
通过map方法进行循环请求
将异步请求方法封装起来,返回一个promise
这样将会返回一个具有多个promise的数组
通过promise.all()方法把promise包装成一个新的promise实例
// 通过Promise把所有的异步请求放进事件队列中 getInfo(item ,index) { const ms = 1000 * Math.ceil(Math.random() * 3) return new Promise((resolve,reject) => { setTimeout(() => { axios.get(id).then((result) => { resolve(result) }) }, ms) }) } // 返回多个promise let promise = arr.map((item,index) = > { arr.forEach((item, index) => { return getInfo(item, index) }) }) // 对返回的promise数组进行操作 Peomise.all(promise).then((allData) => { arr.forEach((item, index) => { // ...... }) })
本文来自 js教程 栏目,欢迎学习!
以上就是解决for循环中异步请求顺序不一致的问题的详细内容,更多请关注其它相关文章!
下一篇: linux如何删除目录
推荐阅读
-
关于angularjs异步操作后台请求时,用$q.all排列先后顺序的问题
-
解决循环中setTimeout执行顺序的问题
-
解决ajax异步请求返回的是字符串问题
-
用Promise解决多个异步Ajax请求导致的代码嵌套问题(完美解决方案)
-
Vue解决axios接口异步请求数据不同步返回的问题-async/await
-
解决Angularjs异步操作后台请求用$q.all排列先后顺序问题
-
AngularJS出现$http异步后台无法获取请求参数问题的解决方法
-
解决循环中setTimeout执行顺序的问题
-
$.Deferred(),for循环内异步请求问题的解决方法
-
解决ajax异步请求返回的是字符串问题