Rückruf innerhalb eines Versprechens innerhalb einer Klasse?

Question

Ich habe eine Klasse, die ich externe Ressourcen über eine XMLHttpRequest laden (das ist für WebGL), also lade ich Modelle, Shader usw. Mein Plan war es, eine Ladeanzeige aufzustellen, während es all diese Anfragen und dann wann es ist endlich fertig Ich möchte es eine Callback-Funktion von der ursprünglichen Funktion ausführen, die es erstellt. Allerdings bekomme ich seltsame Ergebnisse, wenn ich versuche, diesen Aufruf zurück zu führen (so wie er keinen Zugriff auf irgendwelche Objekte innerhalb der Klasse hat, die das Laden durchgeführt hat).

Ich kann dieses Problem umgehen, indem „die“ in die Lade Klasse vorbei und dann

self = this; 
promise(self.callback()); 

zu tun, aber ich würde angeben viel eher die Funktion, dass ich es haben will, um Rückruf nach der den Laden getan . Weiß jemand, ob das möglich ist? Mein Code sieht wie folgt aus:

Hauptklasse

this.loadingClass = new LoadingClass(this.LoadingComplete, resources); 

Main.prototype.LoadingComplete = function() 
{ 
    // Returns undefined if i specify the callback function instead of just "this" 
    console.log(this.loadingClass.anyOfTheMembersOfThisClass); 
} 

Laden Klasse

LoadingClass = function(callback, resources) { 

    .. 

     Promise.all(resources).then(function(loadedResources) 
     { 
      .. 
      callback(); 

     }); 
} 

Answer 1

Wenn Sie die Funktion Objekt als

(this.LoadingComplete, resources) 

das Objekt, an dem es gebunden war, weitergegeben wird nicht passieren. So wird nur die Funktion Objekt LoadingComplete an LoadingClass weitergegeben und wenn es als

aufgerufen wird

callback() 

der this Wert undefined (im Strict-Modus) sein.

Um dies zu beheben,

• müssen Sie das this Objekt binden, wie diese

  new LoadingClass(this.LoadingComplete.bind(this), resources) 
  

• , wenn Ihre Umgebung Funktionen unterstützt

  Arrow ES2015

  new LoadingClass(() => this.LoadingComplete(), resources); 
  

In beiden Fällen wird this beibehalten, wenn LoadingComplete von LoadingClass aufgerufen wird.

Answer 2

Sie Rückruf sind detouching (lesen Sie über "this") Funktion aus dem Wurzelobjekt, so natürlich es verliert den Kontext. Geben Sie explizit mit Binding Function.prototype.bind Methode:

this.loadingClass = new LoadingClass(this.LoadingComplete.bind(this), resources);