Javascript'这'参考资料-有人能解释一下这个简单的例子吗

Javascript 'this' reference - Can someone explain the simple example?

本文关键字：简单 一下 参考资料 能解释 Javascript      更新时间：2023-09-26

我正在深入研究JavaScript，我很难理解实际代码中的"this"引用。有人能解释一下下面例子中的"this"引用吗？

$('#myimage').mouseenter(function() {
    $(this).effect('bounce',500);
});​

我知道"this"关键字指的是拥有声明函数的任何东西。这意味着在以下代码中，"this"将指代objectFunction函数返回的对象：

var objectFunction = function() 
    {
        var thing = function() { alert(this.toString());  };
        return { thing : thing };
    }
objectFunction().thing();

现在在第一段代码中，"this"关键字实际上指的是DOM元素"myimage"。我不知道如何通过检查JavaScript来确定这一点。有人能解释一下吗？

示例中的事件由jQuery处理，而不是由Javascript引擎处理。在Javascript中，可以设置调用函数时"this"所指的内容。jQuery在函数上使用.apply方法来实现这一点。因此，当jQuery解释选择器时，它将为每个匹配的对象调用处理程序函数，并将"this"设置为该匹配的对象。例如

var handler = function() { alert(this.id) }
handler.apply(document.getElementById('something'));

在上面的示例中，处理程序中的"this"将引用id为"something"的dom元素，警报将显示文本"somethings"。

在您的示例中，匿名函数是一个事件处理程序。this关键字将指触发事件的任何元素。在这种情况下，这只能是id为myimage的元素，因为事件仅绑定到该元素。事实并非如此；考虑以下变体：

$('img').mouseenter(function() {
    $(this).effect('bounce',500);
});​

此代码将鼠标输入事件处理程序附加到文档中的所有图像标记。因此this可能指代文档中的任何图像；这取决于鼠标光标"触摸"了哪个图像。

相关文章：