初期化関数のイベントリスナーにプロトタイプ関数を追加するにはどうすればよいですか？

Question

私はので、私は例を提示してみましょう、正確にどのようにフレーズ私の質問をするかわからない：

function foo() { 
    window.addEventListener("keydown", function(event) { 
     bar(event.keycode); 
} 

foo.prototype.bar = function (keycode) { 
//code 
} 

私は​​を使用して試してみたが、それはthisとしてwindowを使用してになります。これを行う方法はありますか、手動で別のメソッドを初期化する必要がありますか？

Answer 1

バインドthis.bar〜thisを渡す前に。

function foo() { 
    window.addEventListener("keydown", this.bar.bind(this), false); 
} 


foo.prototype.bar = function (event) { 
    console.log(event.keyCode); 
} 

デモhttp://jsfiddle.net/2tee4/

Answer 2

代替ソリューションあなたが利用可能Function.prototype.bind *を持っていない、とあなたはFunction.prototypeに余分な機能を追加したくないならthis.barへの呼び出しをオーバー閉じるために、次のようになります。

function foo() { 
    var self; 
    self = this; 
    window.addEventListener('keydown', function (e) { 
     self.bar(e); 
    }, false); 
} 
foo.prototype.bar = function (e) { 
    console.log(e.keyCode); 
} 

_{* addEventListenerをattachEventなしで使用しても、Function.prototype.bindはacce ptable選択は}

---

さらに、このようなjQueryなどのライブラリがbindの独自の形式を含むことができ、jQueryのはjQuery.proxyです。

Answer 3

あなたの意図が作成したすべてのfooのための新しいリスナーを追加する場合は、別のオプションはfooがのEventListenerインタフェースを実装します、と単純にハンドラの代わりにthisを渡すことです。

function Foo() { 
    window.addEventListener("keydown", this, false); 
} 

Foo.prototype.bar = "foobar"; 

Foo.prototype.handleEvent = function(e) { 
    console.log(e.type); // "mousedown" (for example) 
    console.log(this.bar); // "foobar" 
}; 

new Foo(); 

addEventListener()とのみ動作します。

DEMO：http://jsfiddle.net/k93Pr/