Question

我曾经接到过这样的电话：

var link = $('<a />', { 'class': 'prop' + index, title: elt, text: elt });
link.on('click', switchLabel);

switchLabel如下：

function switchLabel(e) {
    $('#' + this.className.replace('prop','corr')).text(this.title);
}

我刚刚意识到this很难理解它在javascript中的含义，所以我换成了：

function switchLabel(e) {
    var source = e.currentTarget;
    $('#' + source.className.replace('prop','corr')).text(source.title);
}

我说错了吗？请在答案中添加一些解释，我们（js noobs）可以学习。

Answer 1

将this描述为非常含糊不清的＃34;是不正确的。特别是，jQuery保证this将引用＆＃34; right＆＃34;处理程序中的元素。

现在，＆＃34;对＆＃34;意味着可能会根据处理程序的建立方式而有所不同，但它总是有意义的。例如，当在.on()调用中直接分配处理程序时，处理程序中this的值将是元素（或其中一个元素，适用于实际采取的操作）从原始选择。如果是委派的.on()，则this将再次成为与选择器匹配的元素。

也就是说，有时候检查e.target是有意义的还是非常必要的;这样做并没有特别错误，但是因为this的迷信而这样做是有点傻。

Answer 2

this并不是很模糊，你只需要了解范围/闭包。尽管如此，如果switchLabel是一个泛型函数，你不应该使用this，如果它现在和永远只用作（jQuery）事件的回调/处理程序，你可以依赖this

Answer 3

e.currentTarget和this在您使用时不会比另一个更糟糕。它们都可以在不需要查找的情况下出现，并且它们在大多数情况下都具有相同的值。但是，在某些情况下，e.currentTarget将不存在。

顺便说一句，

this并不含糊。这完全是一个范围问题，jQuery做得非常好。在jQuery回调中使用this时，可以保证this将是您正在执行的当前元素/结构。没有歧义。

Answer 4

如果使用JQuery绑定处理程序，this将始终引用事件被调用者。

不要用类操作，试试这个：

var link = $('<a />', { 'class': 'prop' + index, 'ind':index, title: elt, text: elt });
link.on('click', switchLabel);

function switchLabel(e) {
    $('#corr'+$(this).attr("ind")).text($(this).attr("title"));
}

在javascript中正确使用这个吗？

4 个答案: