Question

我在JavaScript中看到了与addEventListener函数和this关键字相关的代码。

我知道this引用全局对象，addEventListener在其调用的EventTarget上注册指定的侦听器。

var Something = function (element) {
  this.name = 'Something Good';
  this.onclick1 = function (event) {
    console.log(this.name);
  };
  this.onclick2 = function (event) {
    console.log(this.name);
  };
  element.addEventListener('click', this.onclick1, false);
  element.addEventListener('click', this.onclick2.bind(this), false);
}

在这里，我只需要知道上面脚本的最后一行是如何工作的：

element.addEventListener('click', this.onclick2.bind(this), false);

我理解bind的作用 - 我只需要知道this中两个this.onclick2.bind(this)代表什么。它们是否代表元素和事件属性，即它是否像element.onclick2.bind(event)一样？

Answer 1

this.onclick2.bind(this)

这段代码返回onclick2函数，其this变量绑定到传递给.bind()的参数，在这种情况下为this。

例如：

function testing(parameter){
    console.log(parameter, this);
}
var boundFunction = this.testing.bind({ someKey: 'SomeValue'});
boundFunction("Testing 1 2 3");

将记录：

"Testing 1 2 3", {someKey: "SomeValue"}

这是在javascript中的addeventlistener属性

1 个答案: