循环ajax请求问题

项目开发过程碰到过这种需求:需要循环发送ajax请求,请求参数和循环索引有关。
第一次实现的时候用了类似下面的方法,结果发现发送到后端的参数数据都是最后一次循环的索引

1 for(var i=0; i<10; i++){
2     $.get(url,{param:i},function(){});
3 }

这是js没有块级作用域引起的,for循环中代码块使用的i实际上是同一个,都是最后一次的索引值。
js存在函数作用域,所以可以利用js闭包特性,让for循环中每次请求使用索引值不同。实现代码:

1 for(var i=0; i<10; i++){
2     (function(seq){
3         $.get(url,{param:seq},function(){});
4     })(i);
5 }

这是因为在函数作用域中,内部函数可以访问定义它们的外部函数的参数和变量,并且内部函数比外部函数有更长的生命周期;上面的例子中,$.get()属于内部函数,function(seq){}属于外部函数,内部函数可以直接使用外部函数的参数seq。由于外部函数是立即执行函数,外部函数执行后,会为内部函数创建一个上下文环境,外部函数的参数seq也属于这个上下文环境中的一部分,这个上下文环境存在于内部函数的生命周期中。基于这样的事实,在一次循环中,外部函数执行结束,外部函数的生命周期结束,但是外部函数为内部函数创建的上下文环境仍然有效。因为传参不同,外部函数每次执行创建的上下文环境都不同。对内部函数而言,执行使用的参数seq存在上下文环境中,对于不同的上下文环境,使用的seq值不同。个人理解

原文地址:https://www.cnblogs.com/adtxgc/p/4666270.html