请求多并发

有的时候同一个页面被可能同时产生多个ajax请求，为了用户体验，最好是发送并行请求，这就产生了并发问题，应该如何处理？

并行改串行

这种方法是最简单的了，就是在一个请求执行完后在执行另一个请求。代码如下：

1）在回调中执行下一请求

functionasync1(){
//dosth...
async2();
}

functionasync2(){
//dosth...
}

async1();

2）将 ajax 改为同步，按顺序执行

varurl1,url2;

$.ajax({
url:url1,async:false
});

$.ajax({
url:url2,async:false
});

很显然，这种方法会需要比较长的等待时间，用户体验不是很好。

使用计数器

就是使用一个标志位标记请求是否已经完成

1）循环非阻塞

这种方法会影响性能，尽量少用：

varcnt=0;

functionasync1(){
//dosth...
cnt++;
}

functionasync2(){
//dosth...
cnt++;
}

async1();
async2();

varinterval=setInterval(function(){
if(2===cnt){
console.log('已执行完成');
clearInterval(interval)
}
},0);

2) 回调计数

varcnt=0;

functionasync1(){
//dosth...
callback();
}

functionasync2(){
//dosth...
callback();
}

functioncallback(){
cnt++;
if(2==cnt)
console.log('都已执行完毕');
}

async1();
async2();

第三方框架实现

若使用第三方框架实现，则要看第三方的相关文档：

1）jquery

vard1=$.Deferred();
vard2=$.Deferred();

functionasync1(){
d1.resolve("Fish");
}

functionasync2(){
d2.resolve("Pizza");
}

async1();
async2();

$.when(d1,d2).done(function(v1,v2){
console.log(v1+v2+'已完成');
});

2）axios

//下面是关于同时发起多个请求时的处理
axios.all([get1(),get2()])
.then(axios.spread(function(res1,res2){
//只有两个请求都完成才会成功，否则会被catch捕获
}));

还有很多框架都可以，比如Angular的$wacth等等

ES6来实现

使用ES6中的promise、asyn、await等应该都可以实现，由于本人尚未使用过，暂时不讲，到时候再补充。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!