Javascript 为什么我可以在这里使用handleClick函数？

handleClick方法是在obj中定义的，为什么我可以在按钮的click事件中使用它

var obj={
名称：“测试”，
单击BTN：函数（）{
var btn=document.getElementById（“btn”）；
btn.addEventListener（'click'，this.handleClick）；
},
handleClick:function（）{
console.dir（this）；
}
}
点击btn（）
点击
这是因为在最后你有了这个代码
obj.clickBtn（）

obj.clickBtn（）
基本上将调用
clickBtn
功能，该功能将为按钮分配一个click侦听器。
每次引发click事件时，都会连续调用
handleClick
方法

删除该代码，它将无法工作。在这种情况下，每当您想要处理按钮上的单击事件时，您必须自己添加侦听器。
此
在您的代码段中有两个不同的上下文

btn.addEventListener('click', this.handleClick);

在函数声明中，
此
的上下文是父对象，
obj
。此处
this.handleClick
指的是
obj.handleClick

执行代码时，
handleClick
中的
this
的上下文是执行单击事件处理程序的对象，因此在这种情况下，
btn
。在前一行代码中，
btn
被声明为对具有
id
属性值“btn”的HTML元素的引用

<button id="btn">Click</button>

点击
错误是什么？它似乎工作得很好：你是在问“为什么我可以使用它，因为我不应该使用它”还是在问“为什么我不能使用它”，这很奇怪，因为你are@mplungjan我认为this.handleClick中的this是指btn，但handleClick方法是在obj中定义的。那我为什么要用它呢？我想我应该不能使用它。this.handleClick中的
this
是您创建的对象。我将以前的代码更改为：
btn.addEventListener（'click'，console.dir（this））并且即使我没有点击这个按钮，它也会在控制台中打印obj。在这种情况下发生了什么？“this”是指当前执行上下文的javascript。正如@Dan'this'所正确指出的，在创建对象的过程中，它指向obj本身，因为它是当前的执行上下文，这类似于使用'new'关键字调用构造函数。因此，持有句柄单击功能的“this”被附加到按钮对象。因此，当它执行附加到button对象的“handleclick”时，会调用它，因为它现在是当前执行上下文，“this”将打印button对象。