Доступ к переменной экземпляра внутри анонимной функции внутри метода-прототипа

Question

Это на самом деле дополнительный вопрос к моему предыдущему вопросу, Доступ к переменной экземпляра внутри функции в javascript? .

Я хочу получить доступ к переменной экземпляра внутри анонимной функции внутри метода-прототипа.

function MyObject(){

     //Instance variables
     this.handler;

}
//Methods
MyObject.prototype.enableHandler = function(){
    var button = document.getElementById('button');
    button.onclick = function(){
         this.handler();//Is not working
    }
}
var myObject = new MyObject();
myObject.handler = function(){
    alert('Hello World!');
}
myObject.enableHandler();

JSFiddle http://jsfiddle.net/3cmvZ/

Приведенный выше пример был просто для того, чтобы уточнить, как я могу получить доступ к переменной экземпляра внутри анонимной функции внутри метода-прототипа. Я уже знаю, что button.onclick = this.handler работает.

Answer 1

Проблема не в том, что анонимная функция находится в прототипе, а в том, что это обработчик событий (который не вызывается как метод).

Проблема в том, что в вашем обработчике onclickКлючевые слова this привязаны к объекту windows, а не к экземпляру myObject, на котором установлен прототип.Вы можете сохранить объект в переменной that и создать замыкание:

function MyObject(){

     //Instance variables
     this.handler;

}
//Methods
MyObject.prototype.enableHandler = function(){
    var button = document.getElementById('button');
    var that = this;
    button.onclick = function(){
         that.handler();//Should be working
    }
}
var myObject = new MyObject();
myObject.handler = function(){
    alert('Hello World!');
}
myObject.enableHandler();

Answer 2

this.handler не в той же области. Вы должны объявить это как:

MyObject.prototype.enableHandler = function() {
    var button = document.getElementById("button");
    button.onclick = this.handler;
}

Поскольку вы просто вызываете событие напрямую, вам не нужно заключать его в другую функцию.

Обновление на основе вашего комментария:

MyObject.prototype.enableHandler = function() {
    var button = document.getElementById("button");
    var $this = this;

    button.onclick = function() {
        $this.handler();
    }
}

Вам необходимо создать локальную переменную, которая находится в той же области, что и анонимная функция.