循环中的Ajaxajax
在先后端分离的项目中,Ajax是链接先后端的枢纽。json
需求:有一个须要循环发起n次的请求,可是n次循环传参不一样,我并不知道n是多少,而且要求可以保证返回顺序。JSONP用同步锁无效后端
示例一代码:闭包
for(var i = 0;i<5;i++){
$.ajax({
url : '',
data : {},
type:'GET',
dataType : 'jsonp',
success: function(res){
console.log('ok');
},
error : function () {
console.log(i);
}
});
}前后端分离
这个时候因为url为空,走error方法,咱们想要输出12345,但事实控制台输出了5次5。异步
由于ajax是异步请求,for循环会瞬间执行完,此时ajax尚未正确的返回数据。jsonp
实例二代码:url
for(var i = 0;i<5;i++){
(function (i) {
$.ajax({
url : '',
data : {},
type:'GET',
dataType : 'jsonp',
success: function(res){
console.log('ok');
},
error : function () {
console.log(i);
}
})
})(i)
}spa
想利用闭包的方式传值,这时候输出结果012345不定排序,并非按照我想要的顺序返回,由于咱们不能肯定哪一个AJAX请求是先返回的。排序
示例三代码:
var currentIndex = 0;
function a(){
if(currentIndex >= 5){
return;
}
$.ajax({
url : '',
data : {},
type:'GET',
dataType : 'jsonp',
success: function(res){
alert('ok');
},
error : function () {
currentIndex++;
console.log(currentIndex);
a();
}
});
}
a();
因为咱们并不知道会有多少请求发送,因此以递归的形式循环,既能循环n次ajax请求,又能保证数据返回的顺序。