Question

我的代码看起来像这样：

if (ACTIVETICKETS.length > 0) 
{
    for (var m in  ACTIVETICKETS) 
    {
        if (ACTIVETICKETS.hasOwnProperty(m)) 
        {
            var marker = new L.Marker(new L.LatLng(ACTIVETICKETS[m].location.x, ACTIVETICKETS[m].location.y));
            createHtmlForPopUp(m, function(data)
            {
                console.log(m);
                marker.bindPopup( data ); // calling a function with callback
                tile_layer.addLayer(marker);                           
            });
        }
    } // for loop ends here
}

执行此操作时，我只获得m的最后一次迭代。 ACTIVETICKETS数组的总长度为16.所以我只得到15次进入16次

Answer 1

以下代码应该有效，但正如我上面评论的那样，请阅读 closure ，以便了解为什么。

    if (ACTIVETICKETS.length > 0) {
      for (var m in  ACTIVETICKETS) {
        (function(x) {
          if (ACTIVETICKETS.hasOwnProperty(x)) {
            var marker = new L.Marker(new L.LatLng(ACTIVETICKETS[x].location.x, ACTIVETICKETS[x].location.y));
              createHtmlForPopUp(x, function(data){
                console.log(x);
                marker.bindPopup( data ); // calling a function with callback
                tile_layer.addLayer(marker);
              });
          }
        })(m);
      } // for loop ends here
    }

Answer 2

你遇到的问题是，在调用回调时，m的值是循环结束时的值。解决方案是通过将其设置为立即调用的函数中的变量值来保护此值：

for (var m in  ACTIVETICKETS) {
   (function(m){
        if (ACTIVETICKETS.hasOwnProperty(m)) 
        {
            var marker = new L.Marker(new L.LatLng(ACTIVETICKETS[m].location.x, ACTIVETICKETS[m].location.y));
            createHtmlForPopUp(m, function(data)
            {
                console.log(m);
                marker.bindPopup( data ); // calling a function with callback
                tile_layer.addLayer(marker);                           
            });
        }
    })(m);
 } // for loop ends here

这是因为JavaScript没有块作用域，只在调用函数时才创建新的变量作用域。

您可以使用与命名函数相同的技术，而不是如上所述的内联函数：

function makeTicket(m){
  if (ACTIVETICKETS.hasOwnProperty(m)) 
  {
        var marker = new L.Marker(new L.LatLng(ACTIVETICKETS[m].location.x, ACTIVETICKETS[m].location.y));
        createHtmlForPopUp(m, function(data)
        {
            console.log(m);
            marker.bindPopup( data ); // calling a function with callback
            tile_layer.addLayer(marker);                           
        });
    }
}

然后这样做：

for (var m in  ACTIVETICKETS) {
    makeTicket(m)
} // for loop ends here

作为旁注，有非常令人信服的理由不在数组上使用for-in枚举，而是使用典型的for循环，如果测试你不需要外部，所以你可以删除它，只是做

for (var m =0; m<ACTIVETICKETS.length; m++) {
    makeTicket(m)
}

Answer 3

您需要为要在回调函数中访问的所有变量创建闭包。

    createHtmlForPopUp(m, (function (m, data, marker) {
        return function(data)

        {
            console.log(m);
            marker.bindPopup( data ); // calling a function with callback
            tile_layer.addLayer(marker);                           
        }
    })(m, data, marker));

内部循环中的函数调用只进行最后一次迭代

3 个答案: