Hauptmenü

Untermenü

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