在函数对象中单击事件后保留此上下文

时间:2016-09-26 22:36:36

标签: javascript javascript-events scope onclicklistener javascript-objects

我有一个带有功能的对象。这是一个简化版本:

var app = {

  functOne: function(){
    document.querySelector('button').addEventListener('click', this.functTwo);
  },

  functTwo: function(){
    console.log('Funct Two has Run');
    this.functThree();
  },

  functThree: function(){
        console.log('Funct Three has Run');
  }
};

app.functOne();

functOne中的应用程序将按钮处理程序附加到按钮(以启动functTwo)。 FunctTwo应该执行FunctThree,但'this'的上下文不再是'app'(它现在是按钮)。如何从内部(或传递给)functTwo再次获取“app”(假设app不仅仅像上面的例子那样附加到窗口)。

1 个答案:

答案 0 :(得分:1)

这是通过使用Function.prototype.bind()

实现的
  functOne: function(){
    document.querySelector('button').addEventListener('click', this.functTwo.bind(this));
  },