Question

我是javascript的新手，无法想象这个看似简单的问题。我有一个迭代的元素数组（比如用户名）。我想将这些用户名映射到click事件方法（我知道这不是完美的方式，但它只是看似有用的东西）：

this.events = this.events || {};
var self = this;

for (var i=0; i<arr.length; i++) {
    console.log(data.user[i]);    // < --- this username is correct
    var username = data.user[i];
    $(this.el).append("<td><button class='btn btn-primary save" + i + " btn-sm'>Save</button></td>");

    var eventKeySave = 'click ' + '.save' + i;
    this.events[eventKeySave] = function(){
            (function (username) {
                console.log("inside method save " + username); // <--- this username is wrong
                self.onSave(username, 'something')
            })(username);
        };
}

this.delegateEvents();

现在，在我的onSave方法中，它只是打印用户名：

onSave: function(name, extras) {
    console.log("you clicked save on " + name + " , " + type); // < -- wrong name
}

但为什么我总是只在onSave函数中获取数组的最后一个用户名？

例如，如果我的数组看起来像[ 'david', 'emily', 'stephanie', 'michelle']，则只有michelle被传递到onSave函数，尽管事实上每个按钮的点击事件应该已经分别设置了数组中的名称。

我甚至尝试按值传递用户名，但它仍然无效。我没有看到Javascript中发生了什么？

Answer 1

你需要一个闭包：

this.events[eventKeySave] = (function (name) {
    return function(){
        console.log("inside method save " + name); // <--- this username is now ok
        self.onSave(name, 'something');
    };
})(username);

之所以发生这种情况是因为在for循环结束后调用了该函数，因此“username”的值是所有情况下数组的最后一个值。添加一个闭包，保存返回函数的'username'的实际值

Javascript写过以前的值？

1 个答案: