javascript - 在面向对象的 Javascript 中，将对象成员方法传递给事件处理程序

Question

在 Javascript 中我定义了一个像这样的对象:

function myObject() {
    this.x = 5;
    window.addEventListener("resize", this.resizeHandler);
}

myObject.prototype.doSomething = function() {
    alert(this.x);
}

myObject.prototype.resizeHandler = function() {
    this.doSomething();   // Here occurs error.
}

var obj = new myObject();

但是我遇到了错误消息:

"Uncaught TypeError: undefined is not a function".

问题是“为什么会这样？”解释一下就太好了!

Answer 1

您需要确保this的上下文正确...

function myObject() {
    this.x = 5;
    window.addEventListener("resize", this.resizeHandler.bind(this));
}

myObject.prototype.doSomething = function() {
    alert(this.x);
}

myObject.prototype.resizeHandler = function() {
    this.doSomething();   // Here occurs error.
}

这里使用了.bind(this)。

用作事件处理程序的函数中的 this 发生变化。