将索引从 for 循环传递到 ajax 回调函数 (JavaScript)

Posted 2023-02-22

【中文标题】将索引从 for 循环传递到 ajax 回调函数 (JavaScript)

【英文标题】：passing index from for loop to ajax callback function (JavaScript)

【发布时间】：2011-08-29 23:02:09

【问题描述】：

我有一个包含 ajax 调用的 for 循环，我正在尝试确定将索引从 for 循环传递到回调函数的最佳方法。这是我的代码：

var arr = [2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010];

for (var i = 0; i < arr.length; i++)

  $.ajaxSetup( cache:false )
  $.getJSON("NatGeo.jsp",  ZipCode: arr[i], Radius:   
            document.getElementById("radius").value, sensor: false ,      
            function(data)
             
              DrawZip(data, arr[i]);
        
  );

目前，由于异步ajax调用，只传递了arr数组的最后一个值。除了同步运行 ajax 调用之外，如何将 arr 数组的每次迭代传递给回调函数？

【问题讨论】：

虽然这是关于 30 other questions 的重复，但在循环中使用函数时这是一个非常常见的问题，我希望你不会介意我修改其中一个标签以增加计数到 31 :)

【参考方案1】：

您可以使用 javascript 闭包：

for (var i = 0; i < arr.length; i++) 
  (function(i) 
    // do your stuff here
  )(i);

或者你可以使用$.each:

var arr = [2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010];

$.each(arr, function(index, value) 
  $.ajaxSetup( cache:false );
  $.getJSON("NatGeo.jsp",  ZipCode: value, Radius:   
    document.getElementById("radius").value, sensor: false ,      
    function(data)  
      DrawZip(data, value);
    
  );
);

【讨论】：

这两个解决方案是一样的，这没什么值得，$.each 也没有什么神奇之处。在这两种情况下，都使用匿名函数来创建闭包。

优秀的答案。谢谢。

【参考方案2】：

我没有阅读@Anurag 列出的所有 30 个问题，但我发现以下回调语法似乎有效：

(function(year) 
  return (function(data) DrawZip(data, year););
)(arr[i])

这将替换原来的function(data)。顺便说一下，由于异步响应，结果是随机顺序的

【讨论】：

你节省了我的时间。谢谢。

【参考方案3】：

你甚至可以省略John Resig here提到的for循环括号，我认为这种方式更具可读性

for (var i = 0; i < arr.length; i++) (function(i) 

    // async processing
    setTimeout(function() 
      console.log(i);
    , i * 200); 

)(i);