javascript - 无法访问对象文字内的 "this"

Question

我很难理解如何访问位于我创建的对象文字的方法之一内的 this。

这是一个例子:

var app = {
  click: function(e) {
    e.preventDefault();
    console.log('Clicked');
    this.saywhat();
  },

  saywhat: function() {  
    console.log('Say what ?');
  }
};

var link = document.querySelector('a');
link.addEventListener('click', app.click);

如果我单击该链接，则会收到此错误:Uncaught TypeError: this.saywhat is not a function。如何使 saywhat() 在 click() 内部可用？ (我想找到一个不被迫使用 app.saywhat() 的解决方案)

Answer 1

这是因为事件处理程序中的 this 是注册事件的元素，即 link。

在您的情况下，您可以使用 app.saywhat()，或者您可以使用 Function.prototype.bind 显式指定用作 this 的内容。 。也就是说，

link.addEventListener('click', app.click.bind(app));