Javascriptメンバー関数スコープ外

Question

私はアンカーオブジェクトを作成するクラスを持っています。ユーザーがアンカーをクリックすると、親クラスから関数を実行します。

function n() 
{ 
    var make = function() 
    { 
     ... 

     var a = document.createElement('a');  
     a.innerHTML = 'Add'; 
     //this next line does not work, it returns the error: 
     //"this.add_button is not a function" 
     a.onclick = function() { this.add_button(); }            

     ... 
    } 

    var add_button = function() 
    { 
     ... 
    } 

} 

どうすればいいですか？

Answer 1

"this"を削除する必要があるようです。 add_button（）の前に表示

add_buttonをローカル変数（またはjavascriptクラスが動作する奇妙な方法でプライベート）として宣言しているので、実際には "this"のメンバーではありません。

だけ使用します。

a.onclick = function(){add_button();} 

Answer 2

"この" で "this.add_button（）;"誤っていないと、実際には "add_button（）"関数を持たないアンカー要素自体を参照しています。

おそらく、これは動作します：

a.onclick = function() { n.add_button(); } 

Answer 3

を、それが働いていない理由はonclick機能の文脈でthisがn機能/「クラス」の文脈でthisと同じではないということです。関数内のthisをクラスからthisと等価にするには、thisを関数にバインドする必要があります。

バインディングは関数の範囲を変更する方法です。基本的に関数にバインドする場合は、this変数を置き換えて別のものを指すようにします。 Javascriptでのバインディングの詳細については、this alternateidea articleを参照してください。クラスnのthisのonclick関数には、このようにあなたが望む効果を与える結合する

function n() 
{ 
    var make = function() 
    { 
     ... 
     a.onclick = function() { this.add_button() }.bind(this); 
     ... 
    } 
} 

：

あなたがprototypeを使用していた場合、たとえば、あなたのような何かを行うことができます。