的Javascript范围和调用函数

Question

我的代码：

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

      var x = function() { doStuff(i); }; 
      google.maps.event.addListenerOnce(mapInfos[i].map, 'tilesloaded', x); 
} 

的doStuff方法只是简单地提醒我的价值。 mapInfos有两个条目，所以你希望它提醒0和1，但它会提醒2和2.我可以隐约地理解它为什么这样做（尽管var我应该保持它在本地的循环范围？）但我怎样才能使其按预期工作？

Answer 1

编辑 —注意，第一次发布时，包括原来的问题一个link to a jsfiddle这似乎是什么的问题，目前正在努力实现一个相关的例子，只是它的工作原理。

---

jsfiddle中的代码工作，因为该代码中只有一个“我”。第二个循环中使用的“i”（实际调用函数的地方）与第一个循环中使用的“i”相同。因此，你得到了正确的答案，因为第二个循环通过从零到四个再次的所有值运行“i”。如果你添加了：

i = 100; 
functions[0](); 

你会得到100打印出来。

在JavaScript中引入新范围的唯一方法是一个函数。一种方法是写一个单独的“功能机”的功能：

function makeCallback(param) { 
    return function() { 
    doStuff(param); 
    }; 
} 

然后在您的循环：因为调用了“makeCallback”功能隔离一个副本

for (var i = 0; i < mapInfos.length; i++) { 
    var x = makeCallback(i); 
    google.maps.event.addListenerOnce(mapInfos[i].map, 'titlesloaded', x); 
} 

这会工作将“i”的值转换为返回的闭包中新的唯一“param”实例。

Answer 2

为它创建一个新的范围。

函数创建范围。

function doStuffFactory(i) { 
    return function() { doStuff(i); }; 
} 

for (var i = 0; i < mapInfos.length; i++) { 
    var x = doStuffFactory(i); 
    google.maps.event.addListenerOnce(mapInfos[i].map, 'tilesloaded', x); 
} 

Answer 3

将其更改为

var x = function (param) { doStuff(param); }; 

显然正在发生的事情是，你是在提醒被改变的变量。通过上述更改，即使我更改了它，它仍会提醒正确的值。

Answer 4

的Javascript 不有块范围，所以你不得到x局部于循环。是啊！

虽然它有功能范围。

Answer 5

是的，奇怪的是吧！尖有一个解释

我不知道为什么你的第一个例子中的工作（我没想到它） 尖有，为什么你的第一个例子曾解释 - 之所以你的第二个没有，是因为i的作用域是包含for循环的函数，而不是由for循环定义的作用域。事实上，只有JavaScript中有作用域的东西才是函数。这意味着当你的函数执行时i是2。

你需要做的是创建一个范围，例如：

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

    var x = (function() { 
     return function() { doStuff(i); }; 
    })(i); 
    google.maps.event.addListenerOnce(mapInfos[i].map, 'tilesloaded', x); 
} 

更多见JavaScript closures in for-loops。