Objektorientierung

JavaScript verfügt über eine sehr einfache Unterstützung für objektorientierte Programmierung. Es wird nicht explizit von Klassen gesprochen, da sich die abstrakte Definition eines Objekts nur sehr gering von der konkreten Implementierung einer Funktion unterscheidet. JavaScript-Objekte verfügen über Eigenschaften (Attribute) und Funktionen (Methoden).

Erstellen von Objekten

Im Wesentlichen gibt es drei Möglichkeiten ein Objekt in JavaScript zu erstellen. Im Folgenden sollen diese kurz vorgestellt werden.

Deklaration mit new

Die einfachste Methode Objekte zu erstellen, ist die Verwendung des Schlüsselwortes new object.

person = new Object();
person.name = "Jörg Krause";
person.height = "180cm";
person.run = function() {
  this.state = "running"
  this.speed = "4ms^-1"
}

Ein benutzerdefiniertes Objekt person wird erstellt. Dem Objekt werden zwei Eigenschaften zugewiesen (name und height). Ferner wird eine Mitgliedsfunktion run erstellt, welche wiederum zwei neue Eigenschaften dem Objekt hinzufügt.

Deklaration mit der Literalnotation

Die Literalnotation ist eine implizite Schreibweise, die auch als JSON (JavaScript Object Notation) bezeichnet wird.

myObject = {
 property1: "Hello",
 property2: "World",
 property3: ["start", 1, 2, 3, "ende"],
 method1: function(){
    console.log("Methode wurde aufgerufen: " + this.property1);
 }
};
myObject.method1();

Zunächst wird myObject angelegt und die Eigenschaften property1 bis property3 werden mit Werten belegt (Zeile 2 bis 4). Dann wird eine Memberfunktion method1 (Zeile 6) deklariert.

Die Konstruktorfunktion

Die bisher gezeigten Varianten ein Objekt anzulegen sind etwas eingeschränkt, da keine Möglichkeit besteht, mehrere Instanzen des gleichen Objekts anzulegen. Ferner ist es auch nicht möglich, beim Anlegen Parameter für die Initialisierung des Objekts mitzugeben.
Aus diesem Grund soll an diese Stelle die dritte Variante für das Erstellen eines Objekts mittels Prototyping gezeigt werden. Zunächst wird ein abstraktes Objekt deklariert und anschließend wird dieses mit einem konkreten Parameter instanziiert.

function Cat(name) {
  this.name = name;
  this.talk = function() {
    alert( this.name + " macht miau!" );
  }
}

// Verwendung
cat1 = new Cat("Juri");
cat1.talk() //zeigt "Juri macht miau!";
cat2 = new Cat("Wanja");
cat2.talk() //zeigt "Wanja macht miau!";

Die abstrakte Deklaration des Konstruktors des Objekts unterscheidet sich zunächst nicht von der Deklaration einer Funktion. Der Unterschied ist in der Funktion. Wird hier das Schlüsselwort this zusammen mit einer Eigenschaft oder einer Methode verwendet, weiß der Interpreter, dass es sich nicht um eine Funktion, sondern um einen Konstruktor eines Objekts handelt.

Eine alternative Möglichkeit eine Funktion hinzuzufügen besteht darin, außerhalb der Konstruktorfunktion die gewünschte Eigenschaft oder Funktion direkt der Aufzählungseigenschaft prototype hinzuzufügen (mit oder ohne Dot-Notation).

Cat.prototype[talk] = alert(this.name + " macht miau!")

Nachdem der Prototyp des Objekts erstellt wurde, kann eine Instanz unter Verwendung des Schlüsselwortes new erstellt werden. Die Instanz wird verwendet, indem die Eigenschaft oder Methode mit einem Punkt „.“ getrennt aufgerufen wird.

Methoden und Eigenschaften

Eine Besonderheit von JavaScript ist, dass zur Laufzeit Methoden und Eigenschaften hinzugefügt werden können. Unter Verwendung der Eigenschaft prototype bekommen Sie Zugriff auf die Definition des Objekts.

Auf diese Weise kann das vorherige Beispiel schnell um eine Funktion zum Umbenennen erweitert werden.

Cat.prototype.changeName = function(name) {
   this.name = name;
}
firstCat = new Cat("Juri");
firstCat.changeName("Wanja");
firstCat.talk(); // zeigt "Wanja sagt miau!"

Der Eigenschaft prototype des Objekts Cat wird eine Funktion changeName (Zeile 1) hinzugefügt, indem diese einfach zugewiesen wird. Auf diese Weise wäre es denkbar, einem Browser, welcher Objekte enthält, denen Funktionen oder Eigenschaften fehlen, diese quasi nachzurüsten.

Private Variablen und Funktionen

In JavaScript sind alle Mitglieder öffentlich. Jede Funktion kann auf diese Mitglieder zugreifen, weitere hinzufügen, diese verändern oder entfernen. Jedoch gibt es die Möglichkeit, private Mitglieder zu erzeugen, auf die nur von privilegierten Funktionen zugegriffen werden kann. Dazu wird die Eigenschaft von JavaScript benutzt, dass Variablen in Funktionen nur in diesem Gültigkeitsbereich sichtbar sind.

Private Mitglieder werden innerhalb des Konstruktors deklariert. Eigenschaften werden mit Hilfe des Schlüsselwortes var angelegt. Funktionen werden innerhalb des Konstruktors definiert.

function SomeObject(param) {
  function dec() {
    if (secret > 0) {
      secret -= 1;
      return true;
    } else {
      return false;
    }
  }
  this.member = param;
  var secret = 3;
  var that = this;
}

Der Konstruktor für das Objekt SomeObject wird definiert (Zeile 1). Innerhalb des Konstruktors werden drei Variablen für die Instanzen des Objekts festgelegt. Der Parameter param wird einer öffentlichen Variablen member (Zeile 11) zugewiesen. Ferner werden zwei private Eigenschaften secret (Zeile 12) und that (Zeile 13) definiert.

Die private Funktion dec (Zeile 3) kann auf die privaten Eigenschaften zugreifen, weil diese innerhalb der gleichen Funktion (dem Konstruktor) deklariert sind. Jedoch können private Funktionen nicht auf die Instanzvariable this und damit nicht auf die anderen Mitglieder zugreifen. Aus diesem Grund wurde eine zusätzliche private Variable that eingeführt, die eine Referenz auf this enthält. So können auch private Funktionen auf öffentliche Mitglieder zugreifen.

Öffentliche (public) Funktionen können nicht direkt auf private Funktionen und Variablen zugreifen. Hierfür sind sogenannte privilegierte Funktionen erforderlich.

Privilegierte Funktionen

Eine privilegierte Funktion kann auf private Eigenschaften und Funktionen zugreifen, ist jedoch selbst öffentlich zugreifbar. Alle Funktionen, welche innerhalb des Konstruktors mit Hilfe des this-Operators zugewiesen werden, sind privilegierte Funktionen.

function SomeObject(param) {
  function dec() {
    if (secret > 0) {
      secret -= 1;
      return true;
    } else {
      return false;
    }
  }
  this.member = param;
  var secret = 3;
  var that = this;
  this.privileged = function () {
     if (dec()) {
        return that.member;
     } else {
        return null;
     }
   };
 }

Die privilegierte Funktion (Zeile 16) kann sowohl auf die privaten Funktionen (Zeile 12) und Eigenschaften als auch auf öffentliche Mitglieder (Zeile 17) zugreifen.

new

Neue Objekte werden wie in C++ , Java oder C# mit Hilfe des Schlüsselwortes new erzeugt. Ferner können entsprechende Parameter dem jeweiligen Konstruktor übergeben werden.

cat1 = new Cat("Juri");

delete

Mit dem Schlüsselwort delete können Sie Objekte, welche mit new angelegt wurden, wieder entfernen.

delete cat1;

Profiler
Benutzen Sie die in modernen Browsern über F12 verfügbaren Memory-Profiler, um das Speicherverhalten der Objekte zu erkennen und entscheiden Sie dann, ob `delete` sinnvoll eingesetzt werden kann.

 

Das Buch zu JavaScript – jetzt neu gedruckt und für Ihren Kindle – sofort lieferbar.