javascript - 当 HTMLElement.onclick 事件调用时，在其函数中获取对象的属性 - javascript

Question

我有几个 HTML 元素想要处理 onclick。在 javascript 代码中，我定义了具有属性 name 和函数 whoAreYou() 的原型(prototype)，该函数必须是 onclick 处理程序。它看起来像:

var Somebody = function(name) {
    this.name = name;
}
Somebody.prototype.whoAreYou = function() {
    console.log("I am " + this.name)
};

var somebody = new Somebody("Gary");
document.getElementById("somebody1").onclick = somebody.whoAreYou;

但是 this 引用的是 HTML 元素，而不是 somebody，并且不是“我是 Gary”，而是“我未定义”。

当在构造函数内部定义 whoAreYou 时它正在工作，但我需要继承性。考虑到 whoAreYou 已移至 Somebody.prototype，我如何访问他的 name？

Answer 1

您可以绑定(bind)上下文:

document.getElementById("somebody1").onclick = somebody.whoAreYou.bind(somebody);

或

document.getElementById("somebody1").onclick = function() { 
  somebody.whoAreYou()
};