Question

我目前正在从以下“JavaScript：The Good Parts - O'Reilly Media”一书中学习javascript，其中包含以下内容：

重要的是要理解内部函数可以访问外部函数的实际变量而不是副本，以避免出现以下问题：

// BAD EXAMPLE
// Make a function that assigns event handler functions to an array of nodes the
wrong way.
// When you click on a node, an alert box is supposed to display the ordinal of the
node.
// But it always displays the number of nodes instead.
var add_the_handlers = function (nodes) 
{
    var i;
    for (i = 0; i < nodes.length; i += 1) 
    {
        nodes[i].onclick = function (e) 
        {
            alert(i);
        };
    }
};
// END BAD EXAMPLE

问题：我不明白问题是什么，如果有人能给我一个明确的数字和结果的例子，那将非常感激。

Answer 1

每次循环递增时i的值都会更改，并且事件处理程序将警告i的当前值。因此，如果有8个元素，那么当循环运行完毕时，所有元素都将弹出值7。

该示例的要点是，许多人认为当每个处理程序最初与当前值i（例如0,1,2等）绑定时，它不会更改为{ {1}}递增。此示例演示事实并非如此，并且事件处理函数始终可以访问当前值i，即使在绑定之后也是如此。

Answer 2

这里的问题是你传递给onclick的函数保持对每个循环转弯时递增的相同i的引用。因此，当触发点击时，i已经增加以匹配元素的数量。

Javascript关闭与节点数组

2 个答案: