javascript - 为什么这段使用匿名函数的代码不起作用

Question

我正在尝试使用匿名函数将处理程序添加到 anchor 对象。

我运行这段代码但它不起作用你能解释为什么并尝试修复它吗？谢谢:

var obj = document.getElementsByTagName("a");
var items = ["mouseover", "mouseout"];
for (var i = 0; i < items.length; i++) {
    (function() {
        var item = items[i];
        for (var i = 0; i < obj.length; i++) {
            obj[i]["on" + item] = function() {
                alert("thanks for your " + item);
            };      
        }
    })();               
}

Answer 1

i 被“提升”；换句话说，你的函数被执行为:

var i;
var item; // vars are hoisted to the beginning

item = items[i];
for (i = 0; i < obj.length; i++) {
    obj[i]["on" + item] = function() {
       alert("thanks for your " + item);
    };      
}

所以 items[i] 中的 i 不是指外部 i。相反，i 是 undefined。您应该使用单独的变量名称，例如j 用于内部循环:

for (j = 0; j < obj.length; j++) {

其次，item 会发生变化，因此警报每次都会使用相同的值。为了避免这种情况，您可以使用匿名函数，但它们的重点是传递值以使其“卡住”:

var obj = document.getElementsByTagName("a");
var items = ["mouseover", "mouseout"];
for (var i = 0; i < items.length; i++) {
    var item = items[i];

    (function(item) {
        for (var j = 0; j < obj.length; j++) {
            obj[j]["on" + item] = function() {
                alert("thanks for your " + item);
            };      
        }
    })(item);               
}