无法访问对象文字内的 "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);

如果单击 link，我会收到此错误：Uncaught TypeError: this.saywhat is not a function。如何让 saywhat() 在 click() 中可用？（我想找到一个我不被迫使用的解决方案app.saywhat()）

Answer 1

使用.bind

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

Example

Answer 2

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

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

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

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

Unable to access "this" inside an object litteral

javascript

object

this

object-literal