• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

"this" undefined in Funktion in Klasse

Tonald Drump

Neues Mitglied
Hi,

ich habe es versucht zu googlen, aber ich glaube mir fehlen die richtigen Bezeichnungen. Ich fange gerade erst an mit Javascript und Co. Es läuft soweit ganz gut und schön. Momentan baue ich eine Klasse für Listboxen. Es gibt aber immer wieder ein Problem, auf das ich regelmäßig stoße. Meine bisherigen Lösungsansätze verschweige ich hier jetzt mal aus Scham. Es dreht sich um folgendes:

Code:
class ListBox {

      createOption(value, text) {};

      sortMe()
      {
          (...)
          myArray = this.giveAll().sort(Comparator);
                                               
          this.killAll();
          myArray.forEach(function(element)
                                                 {
                                                   
Das Problem   ---------->   this.createOption(element[0], element[1]);    
                                                   
                                                 });
                                               
                                               
                                               
                    }
}

Auf das wesentliche reduziert sieht so meine Klasse aus. Wenn ich in einem PHP script die createOption ausführen möchte, tut er das mit "this" (bzw $this->). Dieses "this" in Javascript ist jedoch leider nicht definiert. Beziehungsweise manchmal funktioniert es, manchmal nicht. Kann mir jemand kurz erklären, worin mein Denkfehler liegt? "this.giveAll()" oben drüber funktioniert ja. Ich dachte auch zuerst, dass er mit "this" versucht auf "element" zuzugreifen, aber das stimmt auch nicht. Per "console.log(this)" gibt er mir an der Stelle einfach ein "undefined".

Würde mich freuen, wenn mich jemand erleuchten kann.

EDIT:
Meine Zwischenlösung ist, dass ich mir das "this" in eine Zwischenvariable speicher. Zunächst:
Code:
var a = this;

und die funktion in der each-Schleife rufe ich dann mit

Code:
a.createOption...

auf. Klappt, aber ist glaube ich nicht die feine englische Art.


Herzlichen Gruß,
 
Zuletzt bearbeitet:
Werbung:
Lässt sich anhand des unvollständigen Codes schlecht beantworten.

Vorab gesagt hat das this Keyword bis einschließlich ES5 seine Tücken. Sofern es aus einem untergeordneten isolierten Scope aufgerufen wird, referenziert es das Window Object. Aus dem Grunde verwendet man dort Konstrukte wie var self = this und bezieht sich dann auf self.

Da du hier das class Keyword verwendest, gehe ich mal davon aus, dass ES6 zum Einsatz kommt. Das braucht dann natürlich einen Transpiler wie Babel oder Traceur, um in aktuellen Browsern zu funktionieren. Anbei ein Beispiel für eine einfache Klasse, die eine Methode returned.
https://jsbin.com/gegimilupi/edit?js,console

Wenn du dich schon mit JS OOP beschäftigst und da du ohnehin einen Transpiler benötigst, würde ich dir den Wechsel zu TypeScript empfehlen. Das erweitert JS um zusätzliche Features wie bsw. Interfaces und Strong Types und ist für Leute, die Erfahrung mit PHP/Java besitzen, leicht zu lesen.
Hier nochmal dieselbe Klasse wie oben in TS und 'altem' ES5.
https://www.typescriptlang.org/play... new Car('BMW'); console.log(car.start());
 
Zurück
Oben