OOP mit JavaScript - Grundlagen
1. Der feine Unterschied
Im Gegensatz zu PHP (und auch Java!) benötigt man bei JavaScript keine Klasse, um daraus ein Objekt zu erzeugen. Da gelten ein paar andere Regeln, die ich zuerst vorstellen möchte.
Konzept | Klassisches OOP-Modell | OOP-Modell JavaScript |
---|---|---|
Entwurfsmuster | Klasse | Konstruktorfunktion (*) |
Objekt wird erzeugt aus | Klasse | Konstruktorfunktion (*) oder als eigenes Objekt |
Objekt benötigt Klasse | Ja | Nein |
Vererbung | Über Klassen | Über Prototypen/Aggregation |
Methoden | Ja | Ja |
Eigenschaften | Ja | Ja |
Sichtbarkeitsstufen für Methoden und Eigenschaften |
private protected public |
private public (mit Einschränkungen) |
Statische, finale, abstrakte Klassen/Methoden/Eigenschaften , Interfaces |
Ja | Nö, können teilweise nachgebildet werden |
(*) Der Ausdruck Konstruktorfunktion ist auf den ersten Blick ziemlich seltsam. Und auf den zweiten auch. Denn dabei handelt es sich dabei nicht immer um einen Konstruktor im eigentlichen Sinn, aber das scheint bei JavaScript egal zu sein. Oder auch nicht, ist mir mittlerweile ziemlich wurscht. Egal, dieser Ausdruck scheint üblich zu sein, darum benutze ich ihn hier auch konsequent, ob er nun korrekt ist oder nicht. Persönlich bevorzuge ich die Bezeichnung "Pseudoklasse". Aber ich lass es mal lieber, sonst nörgelt wieder jemand rum.
2. Einzelobjekte erzeugen
Das geschieht mit dem bekannten Wörtchen new
. Im Gegensatz zu PHP benötigt man dafür keine Klasse, so lange
man mit Object
arbeitet. Im folgenden Beispiel erzeugt man ein leeres Objekt mit der Referenzvariablen obj
.
// Einzelnes neues Objekt erzeugen
var obj = new Object();
Eigenschaften
Will man nun dem Objekt eine Eigenschaft verpassen, so geschieht das ganz einfach damit.
obj.eigenschaft = 'blubber';
Methoden
Ist auch kein Problem, dazu reicht der folgende Code aus.
obj.methode = function()
{
alert ('hallöle');
}
3. Der Zugriff
Will man nun auf eine Eigenschaft oder Methode zugreifen, so geschieht das wie gehabt über die Referenz-/Instanzvariable plus dem Namen. Beide sind also komplett öffentlich zugänglich.
alert (obj.eigenschaft);
obj.methode();
Zugriff auf Eigenschaften in Methoden
Hier gibt es zwei Möglichkeiten. Entweder greift man auf die Referenz zu oder man benutzt this
. Die Wirkungsweise ist
identisch, nur das Prinzip anders.
var obj = new Object;
obj.eigenschaft = 'blubb';
obj.methode = function()
{
// entweder
alert (obj.eigenschaft);
// oder
alert (this.eigenschaft);
}
obj.methode();
Erläuterung
Da bei dieser Vorgehensweise alle Eigenschaften öffentlich zugänglich sind, greift in der ersten Variante alert
(obj.eigenschaft);
die Methode einfach über die Instanz/Referenz darauf zu. Bei der zweiten Möglichkeit wird dagegen
this
benutzt. Das ist genau wie in PHP ein Verweis auf das eigene(!) Objekt. Allerdings gibt es dabei noch ein paar
Überraschungen für euch, wenn man mit this
in einem anderen Zusammenhang arbeitet. Aber dazu komme ich später.
4. Objektgebundenheit
Bei dieser Vorgehensweise ist sowohl die Eigenschaft als auch die Methode an das erzeugte Objekt gebunden. Erzeugt man ein neues Objekt unter demselben Namen, so werden alle bereits existierenden Eigenschaften und Methoden ins Nirwana befördert und euch haut es eine saftige Fehlermeldung um die Ohren.
var obj = new Object ();
obj.eigenschaft = 'blubb';
obj.methode = function ()
{
alert (obj.eigenschaft);
};
// Funktioniert nicht, da ein neues Objekt erzeugt wurde
var obj = new Object ();
obj.methode();
alert (obj.methode);
Aber
Andere Objekte haben trotzdem Zugriff auf die Eigenschaften und Methoden und zwar über die Referenz- beziehungsweise Instanzvariable.
var obj_1 = new Object ();
obj_1.eigenschaft = 'blubb';
obj_1.methode = function ()
{
alert (obj_1.eigenschaft);
};
var obj_2 = new Object();
obj_2.methode = function ()
{
alert (obj_1.eigenschaft);
}
obj_2.methode();
zurück zum vorherigen Abschnitt weiter zum nächsten Abschnitt