搜索

+

81

-

js中如何实现多个ajax请求并行执行并返回结果？

html5 javascript

var ret=[];
for(i=0;i<6;i++){
 ajax(/**/).sucess(function(res){ret.push(res)});
}
console.log(ret);

今天项目中遇到一个问题，就是同时要执行多个ajax请求，然后在汇总结果，但是由于js是异步的，还没请求完就汇总结果了，怎么办？

网友回复

+

1

-

可以实现promise实现，promise可以很优雅地实现并行和串行执行方式

var ret=new Array();
/**
 * 创建promise
 * @param {Number} value 
 */
function makePromise (value) {
  return new Promise((resolve) => {
    $.ajax(success(function(res){
       ret.push(res);
       resolve(value);
    }));

  })
}

let promises = [1, 3, 4, 5, 6].map((item, index) => {
  return makePromise(item)
});

// 并行执行
Promise.all(promises)
.then(() => {
  console.log('done')
})
.catch(() => {
  console.log('error')
})

// 串行执行
let parallelPromises = promises.reduce(
  (total, currentValue) => total.then(() => currentValue.then(print)),Promise.resolve()
)

parallelPromises
.then(() => {
  // console.log('done')
})
.catch(() => {
  console.log('done')
})

// 顺带复习一下reduce方法

reduce((total, currentValue, currentIndex, arr) => {}, initialValue)
let arr1 = [1, 2, 3, 4, 5]
let res = arr1.reduce((total, currentValue, currentIndex, arr) => {
    return total + currentValue
});

/**
 * 打印结果
 * @param {Number} value 
 */
function print (value) {
  return value
}

by bfwui

我知道答案，我要回答

我有问题

云产品购物券

最新提问