innere Funktionsvariable verlorenem 'this' Wert der äußeren Funktion

Question

I eine Klasse in JavaScript wie folgt erstellt:

class TreeMatching 
{ 
     constructor() 
     { 
      this.thresholdPoints=0; 
      this.neighborWeight = 0.4; 
      this.totalFrequency = 0.0; 
      this.listSeq = []; 
      this.listFreq = []; 
      this.mapScore = new Object(); 
      this.tree = new Trie(); 
     } 

     createTree() 
     { 
      var list_Dictionary; 
      var loadWordList = $.get("../wordFrequencyTop5000.txt", function(data) 
      { 
       list_Dictionary = data.split("\n"); 
      }); 

      loadWordList.done(function() 
      { 
       for(var i=0;i<list_Dictionary.length;i++) 
       { 
        var string = list_Dictionary[i]; 
        this.tree.insert(string); //<-- Cannot read property 'insert' of undefined 
       } 
      }); 

     } 
} 

die angeblich die insert Methode in der Klasse Trie nennen wie folgt:

class Trie 
{ 
     constructor() 
     { 
      this.count=1; 
      this.root = new TrieNode(); 
     } 

     insert(word) 
     { 
      var children = new Object(); 

      for(var i=0; i<word.length(); i++){ 
       var c = word.charAt(i); 

       var t; 
       if(children[c]){ 
         t = children[c]; 
       }else{ 
        t = new TrieNode(c); 
        children.put(c, t); 
       } 

       children = t.children; 

       //set leaf node 
       if(i==word.length()-1) 
        t.isLeaf = true; 
      } 
     } 
} 

Die Codezeile, in der der Fehler markiert ist, die äußere Funktion hat jedoch nicht die folgenden Eigenschaften: tree, mapScore, usw.

Gibt es eine Möglichkeit, auf diese Werte von der inneren Callback-Funktion zuzugreifen?

Dank

Answer 1

look at 'this' - Sie werden lokale Variable definieren Verweis auf „diese“ innerhalb der Anruf zu halten, wie in dem Link beschrieben.

createTree() 
     { 
      var self = this; 
      var list_Dictionary; 
      var loadWordList = $.get("../wordFrequencyTop5000.txt", function(data) 
      { 
       list_Dictionary = data.split("\n"); 
      }); 

      loadWordList.done(function() 
      { 
       for(var i=0;i<list_Dictionary.length;i++) 
       { 
        var string = list_Dictionary[i]; 
        self.tree.insert(string); //<-- Now you should be able to do it 
       } 
      }); 

     } 

Answer 2

'dies' in den inneren anonym hat einen anderen Umfang. Versuchen Sie, den Vorteil von näher in JS zu verwenden, der Zugriff auf den Funktionsaufruferbereich erhält.

var that = this; 
loadWordList.done(function() { 
    for(var i=0;i<list_Dictionary.length;i++) 
    { 
     var string = list_Dictionary[i]; 
     that.tree.insert(string); // 'that' will hold 'this' in the right scope 
    } 
}); 

Answer 3

Die anonyme Funktion in loadWordlist.done erstellt einen neuen Bereich mit einem neuen Kontext.

wenn Sie den alten Kontext halten Sie die ES2015 Pfeil Funktion verwenden können:

loadWordList.done(() => { 
    //code here 
); 

oder eine var innerhalb createTree() wie folgt machen:

var that = this; 

und dann innerhalb des loadWordList Rückruf Sie können auf den richtigen Kontext verweisen mit:

that.tree.insert(string); 

Ich persönlich bevorzuge den Pfeil fu weil "das" eine schlechte Wahl für einen Var-Namen ist. Und da Sie die Browser-Unterstützung der ES2015-Klassen verwenden, darf dies kein Problem darstellen.