Javascript Member Functions Out of Scope

Question

J'ai une classe qui crée un objet d'ancrage. Lorsque l'utilisateur clique sur l'ancre, je veux qu'elle exécute une fonction de la classe parente.

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() 
    { 
     ... 
    } 

} 

Comment puis-je faire cela?

Answer 1

On dirait que vous avez juste besoin de se débarrasser de la "ceci". devant add_button()

Vous déclarez add_button comme une variable locale (ou privée de la même manière que les classes javascript), donc ce n'est pas un membre de "this".

utiliser Just:

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

Answer 2

Le "ceci" dans "this.add_button();" fait référence à l'élément d'ancrage lui-même qui n'a pas de fonction "add_button()", si je ne me trompe pas.

Peut-être que cela fonctionnerait:

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

Answer 3

La raison pour laquelle il ne fonctionne pas est que this dans le contexte de la fonction onclick n'est pas la même chose que this dans le contexte de la fonction n/« classe ». Si vous voulez this dans la fonction pour être équivalent à this de la classe, vous devez lierthis à la fonction. La liaison est une manière de changer la portée d'une fonction - essentiellement si vous liez à une fonction, vous remplacez la variable this pour pointer vers quelque chose d'autre. Vous pouvez en savoir plus sur la liaison en Javascript au this alternateidea article.

Si vous utilisez prototype, par exemple, vous pouvez faire quelque chose comme:

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

qui lierait la classe n « s this à la fonction onclick, donnant ainsi l'effet que vous voulez.