1

通过引用传递给闭包的变量。这段代码:

var figs = ['circle', 'square'];
for (var i in figs) {
    var fig = figs[i];
    document.getElementById(fig).addEventListener("click", function(e) {
        console.log(fig);
    }, false);
}

即使您单击圆圈squarefig变量的最后一个值) ,也始终记录最后一个数组元素。

为了绑定fig变量的实际值,我在函数调用中使用包装(因此中间闭包保持循环值):

var figs = ['circle', 'square'];
for (var i in figs) {
    var fig = figs[i];
    document.getElementById(fig).addEventListener("click", (function(fig) {
        return function(e) {
            console.log(fig);
        }
    })(fig), false);
}

是否可以避免包装函数以按值传递?

更新相关问题和答案:

4

2 回答 2

4

不,这是不可能的。

但是,您可以通过将生成内部函数的代码移出循环来使您的代码更好一些:

var figs = ['circle', 'square'];
function createFigHandler(fig) {
    return function(e) {
        console.log(fig);
    }
}

for (var i = 0; i < figs.length; i++) {
    var fig = figs[i];
    document.getElementById(fig).addEventListener("click", createFigHandler(fig), false);
}

jsFiddle

于 2013-11-11T15:17:24.067 回答
2

您还可以使用bind并传递一个封装了您需要的变量的对象。然后,您可以利用this.fig处理程序内部来引用您的图形。

document.getElementById(fig).addEventListener("click", (function(e) {
     console.log(this.fig);
}).bind({ fig: fig }), false);

您也可以直接绑定原始值,但是它将被包装在其各自的对象包装器中,例如Number数字、String字符串等。

document.getElementById(fig).addEventListener("click", (function(e) {
    //this will be the same as new String(fig)
}).bind(fig), false);
于 2013-11-11T15:21:08.953 回答