例子:
var o = {};
for(var i = 0; i < 5; i++) {
o[i] = function () {
console.log(i);
};
}
o[3]();
当我调用 o3 时,它总是会在控制台上显示 5,即使我调用了 o0、o4 或其中任何一个。它将始终显示 5 因为这是我拥有的最后一个值。当创建匿名函数时,如何让它显示 i 的值?如 o3 应在控制台中显示 3 。
例子:
var o = {};
for(var i = 0; i < 5; i++) {
o[i] = function () {
console.log(i);
};
}
o[3]();
当我调用 o3 时,它总是会在控制台上显示 5,即使我调用了 o0、o4 或其中任何一个。它将始终显示 5 因为这是我拥有的最后一个值。当创建匿名函数时,如何让它显示 i 的值?如 o3 应在控制台中显示 3 。
你应该做:
var o = {};
for(var i = 0; i < 5; i++) {
(function(i) { // <- self-executing anonymus function with a parameter i
o[i] = function () {
console.log(i); // <- i here will be the argument i,
// not the i from the loop
};
})(i); // <- pass i as an argument
}
o[3]();
发生的事情是你创建了一个叫做闭包的东西来保持i的状态。
闭包意味着内部函数保持对外部函数的引用,因此可以访问其变量和参数(即使在外部函数返回之后)。
一个简单的闭包示例是:
function outer(arg) {
var variable = 5;
arg = 2;
function inner() {
alert(variable); // <- the inner function has access to the variables
alert(arg); // and parameters of the outer function
}
}
自执行(自调用或立即)函数是在声明后立即调用的函数。
(function() {
alert("executed immediately");
})();
两者的结合以及只有函数在 Javascript 中具有作用域这一事实,引导您使用上述技术来创建一个具有新函数的作用域,该函数保持i的状态,否则内部函数会因为闭包而改变它。
o[i] = (function (i) {
return function () { console.log(i); }
})(i);