JavaScript实现串行请求的示例代码
使用async和await
varfn=asyncfunction(promiseArr){
for(leti=0,len=arr.length;i
Promise实现
依照promises规范，一旦一个promise被创建，它就被执行了。如果then方法里返回的是一个promise对象，那么执行下一个then的时候必定是在上一个then执行完之后执行。
关键点在于then的时候再创建
varcreatePromise=function(time){
return(resolve,reject)=>{
returnnewPromise((resolve,reject)=>{
setTimeout(()=>{
console.log('timein'+time)
resolve();
},time*1000)
})
}
}
functionserpromise(arr){
arr.reduce((pre,next,index,carr)=>{
returnpre.then(next)
},Promise.resolve())
}
vararr=[createPromise(2),createPromise(1),createPromise(3),createPromise(4),createPromise(5)];
//相当于
//Promise.resolve().then(createPromise(2)).then(createPromise(1))......
serpromise(arr)
Array.prototype.reduce+async/await版本
constreduceAsync=(arr)=>{
arr.reduce(async(prev,curr)=>{
const{rep}=awaitprev;
constobj=awaitpromise(curr,rep);
console.log(obj);
returnobj;
},Promise.resolve({}));
};
Array.prototype.reduce+Promise版本
constreducePromise=(arr)=>{
arr.reduce((prev,curr)=>{
returnprev.then(data=>{
returnnewPromise((resolve,reject)=>{
promise(curr,data.rep).then(res=>{
console.log(res);
resolve(res);
});
});
});
},Promise.resolve({}));
};
#执行结果
{req:'PM:04:49:08',rep:'PM:04:49:11',item:1}
{req:'PM:04:49:11',rep:'PM:04:49:14',item:2}
{req:'PM:04:49:14',rep:'PM:04:49:17',item:3}
{req:'PM:04:49:17',rep:'PM:04:49:20',item:4}
Array.prototype.map+Promise版本
constmapPromise=(arr)=>{
lettemporary=Promise.resolve({});
arr.map((item,index)=>{
temporary=temporary.then((data)=>{
if(i!==0){
//第一个初始promise
console.log(data);
}
returnpromise(item,data.rep);
});
});
//最后一个promise
temporary.then(data=>console.log(data));
};
用map遍历时，需要过滤初始promise的返回值，并且在遍历结束后，需手动执行最后以后一个promise，否则就会变成如下结果
#执行结果
{}
{req:'PM:04:49:08',rep:'PM:04:49:11',item:1}
{req:'PM:04:49:11',rep:'PM:04:49:14',item:2}
{req:'PM:04:49:14',rep:'PM:04:49:17',item:3}
以上结果明显不是我们所需要的，但是需要手动过滤第一个promise和执行最后一个promise，会增项不必要的代码量和出错率后将mapPromise修改如下，其原理和Array.prototype.reduce+Promise版本类似
constmapPromise=(arr)=>{
lettemporary=Promise.resolve({});
arr.map((item,index)=>{
temporary=temporary.then((data)=>{
//if(i!==0){
////第一个promise
//console.log(data);
//}
returnnewPromise((resolve,reject)=>{
promise(item,data.rep).then(data=>{
console.log(data);
resolve(data);
});
});
});
});
//最后一个promise
//temporary.then(d=>console.log(d));
};
其他
Array.prototype.forEach、Array.prototype.filter、Array.prototype.some、Array.prototype.every等方法和Array.prototype.map类似，就不过多赘述
以上就是JavaScript实现串行请求的示例代码的详细内容，更多关于JavaScript实现串行请求的资料请关注毛票票其它相关文章！
声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。