Objekte

Jedes Element einer Website ist ein eigenes Objekt. Ein Objekt ist wie ein Behälter und enthält den Namen, die Eigenschaften und Methoden. Eigenschaften und Methoden werden als Members des Objekts bezeichnet.

Eigenschaften = Attribute, Elemente

Methoden = Funktionen

Was sind Objekte?

Ein Auto hat z.B. eine bestimmte Farbe (Eigenschaft) und kann einen von A nach B bringen (Fähigkeit). Eine objektorientierte Sprache, wie JavaScript, stellt Objekte zur Verfügung, die genauso über Eigenschaften und Fähigkeiten verfügen. Auch der Browser, das Eingabefeld und Bilder sind Objekte. So besitzt der Browser eine bestimmte Größe (Eigenschaft) und kann auf dem Bildschirm verschoben erden (Fähigkeit). Auch eine Zeichenkette hat Eigenschaften (z.B. Länger) und Fähigkeiten (z.B nach Zeichenfolge suchen).

Eigenschaften

Diese sind wie eine Variable, die einem Objekt zugeordnet werden. So kennt ein Eingabefeld beispielsweise die Eigenschaft value, in der der aktuell enthaltene Text gespeichert ist.

Methoden

Sind einfach gesagt Funktionen, die in Bezug zu einem bestimmten Objekt stehen.

Methode um das Browserfenster an eine neue Position zu verschieben: moveTo()

IM Gegensatz zu herkömmlichen Variablen und Funktionen muss also bei Eigenschaften und Methoden immer Bezug zu einem Objekt vorhanden sein (dieses eine Auto hat die Farbe rot, nicht nur den Wert „rot“ gespeichert).

Abhängigkeit von Objekten

Objekte stehen häufig in Beziehung zueinander (z.B. Eingabefeld und Browserfenster)

Einige Objekte (z.B. Browserfenster) existieren automatisch und man muss sie somit nicht erzeugen. Man kann Objekte über den allgemeinen Konstruktor object(), über den allgemeinen Konstruktor über Literale {}, oder über einen eigenen spezialisierten Konstruktor des Programmierers geschrieben werden (wie Klassen in Java).

Den Konstruktor aufrufen

Um ein String-Objekt mit dem Inhalt „JavaScript“ zu erzeuge, schreibt man:

var str = new String („JavaScript“);

Der Konstruktor hat den gleichen Namen wie das Objekt. In diesem Falle also String(). Der Aufruf des Konstruktors erfolgt über das Schlüsselwort new. Der Aufruf des Konstruktors erzeugt ein neues String-Objekt und liefert eine Referenz auf dieses Objekt zurück, die in der Variablen str gespeichert wird.

Auf Eigenschaften zurückgreifen

Das string-Objekt kennt die Eigenschaft length, somit kann man die Länge de Zeichenkette herausfinden. Man macht folgendes um auf die Eigenschaft zuzugreifen:

var laenge = str.length;

Methoden verwenden

Die Methode indexOf() kennen wir ja bereits. Um diese Methode anzuwenden schreibt man:

var pos = str.indexOf(„Script“);

Erzeugung über denn allgemeinen Kontsruktor: object()

Beispiel:

mit var person1= new Object() erzeugen wir Objekt des Typs Object.

person1.name = „Fred“; definier eine Variable person1, in der eine Referenz auf das mit new erzeugte Objekt gespeichert ist. Hier haben wir auf die Variable zugegriffen und ihr die Eigenschaft name mit dem Wert „Fred“ zugewiesen.

wenn man eine Begrüßung oder ähnliches schreiben möchte, macht man das mit this:

person1.begruessung = function() {

alert(„Hallo“ + this.name + „!“);

}

bzw. im Ganzen:

Wie schon in einigen Kapiteln davor beschrieben, greift this immer auf das aktuelle Objekt zu.

Achtung, der Bezug zu dem Objekt von der Methode begruessung() darf nicht fehlen!

JSON

JSON ist der allgemeine Konstruktoraufruf über Literale {}

Hier das oben genannte Beispiel, dieses mal mit JSON:

Wie man sehen kann, werden die Eigenschaften und Methoden in geschweiften Klammern aufgeführt. Auch kommt nach der Eigenschaft ein Doppelpunkt und kein Ist-gleich. Die einzelnen Einträge innerhalb der Methode werden mit Kommas getrennt.

parse(): mit dieser Methode kann man ein Objekt auf Basis eines Strings, der eine Objektdefinition nach obigem Beispiel erhält erstellen.

stringfy(): Damit kann man ein bestehendes Objekt in einen String umwandeln (also das Gegenteil von parse()).

Erzeugung von Objekten durch eigenen spezialisierten Konstruktor

Bislang in meinem Portfolio wurden konkrete Objekte erzeugt, das waren alles Instanzen. Ein Konstruktor ist eine Funktion zur Erstellung von Objekten.

Diese Möglichkeit zur Erstellung erzeugt zuerst ein Objekt vom Typ Object und ergänzt nachträglich die Eigenschaften und Methoden.

Häufiger wird jedoch ein Konstruktor definiert, der sich um die Erzeugung des Objekts kümmert:

Der Konstruktor Person() wird wie eine ganz normale Funktion definiert. Es ist oft so, dass der Name mit einem Großbuchstaben beginnt, um zu zeigen, dass es sich um einen Konstruktor handelt. Innerhalb des Konstruktors wird mit this sowohl die Eigenschaft name, als auch die Methode begruessung() definiert. Mit new Person kann ein neues Objekt erzeugt und in person1 kann eine Referenz darauf gespeichert werden.

Man kann aber such für die Methode begruessung() eine anonyme Funktion verwenden:

Konstruktor mit Übergabewert

Damit der Konstruktor auch mit unterschiedlichen Namen verwendet werden kann, muss man mit Übergabewerten arbeiten:

Dann kann man beim Aufruf des Konstruktors einen Namen eingeben:

In diesem Beispiel wurde der Übergabewert n genannt, meistens wird jedoch die gleiche Bezeichnung, wie für die Eigenschaft genommen:

function Person (name) {

this.name = name;

…

}

Das funktioniert ohne Probleme, denn this.name und name haben unterschiedliche Bedeutungen. this.name ist die Eigenschaft name des aktuellen Objekts und name der Übergabewert, also im Prinzip eine lokal definierte Variable.

die for in-Schleife

Diese bietet sich vor allem für Objekte, wenn man alle Eigenschaften eines Objekts durchwandern möchte. Die folgende Schleife gibt alle Eigenschaften des window-Objekts aus (Dieses repräsentiert das Browswerfenster):

for (i in window) {

alert (i + „-“ + window[i]);

}

i nimmt im Verlauf der Schleife die jeweiligen Namen der einzelnen Eigenschaften an. Mit window[i] greifen wir auf die Werte dieser Eigenschaften zu. Als Resultat bekommt man also eine Reihe von Hinweisfenstern.

Der instanceof Operator

Damit kann man überprüfen, welchen Typ ein bestimmtes Objekt hat. Er kann entweder true oder false zurückgeben.

if (x instanceof String), wenn x ein String-Objekt ist, ist die Bedingung erfüllt.

with

Wenn man mehrere Merkmal hintereinander auf ein Objekt zugreifen möchte, kann man with verwenden. Mit with sagt man, dass die nachfolgenden Befehle im Zusammenhang mit einem bestimmten Objekt stehen. Wenn man ein Objekt obj mit den Eigenschaften a und b hat, kann man folgendes schreiben:

Call by Reference

Im Gegensatz zu Call by Value (Funktionen im Zusammenhang mit Variablen), wird wenn man ein Objekt an eine Funktion übergibt, nur eine Referenz auf ein Objekt an die Funktion übergeben und nicht eine Kopie des Objekts. Das nennt sich dann Call by Reference. Das hat zur Folge, dass Äderungen am Objekt innerhalb einer Funktion das Objekt dauerhaft verändern.

Objekte können auch andere Objekte enthalten.

Kapselung

Ein Ziel der objektorientierten Programmierung ist die Aufteilung des Quellcodes in eigenständige Objekte, um sie die Komplexität zu reduzieren. Die Idee ist, die Interaktion mit einem Objekt auf wenige Punkte zu beschränken. So soll es ein paar Eigenschaften und Methoden geben, die als Schnittstelle zum restlichen Quellcode dienen.

Wie in Java gibt es auch hier öffentliche und private Methoden und Eigenschaften. Wenn die Eigenschaft mit this innerhalb des Konstruktors definiert wird, ist es eine Öffentliche. Ohne this wäre sie privat. Somit kann man außerhalb nicht auf b zugreifen.

Prototyping

wird benutzt, um Methoden auch nachträglich hinzuzufügen:

Prototyping ersetzt klassenbasierte Vererbung. Das Objekt wird wie bei klassenbasierter Vererbung um neue Eigenschaften und Methoden erweitert. Auch bereits existierende Objekte können mit Prototyping erweitert werden.

Wenn eine neue Eigenschaft für alle Objekte gelten, die mit einem Konstruktor (z.B. Konstruktor X()) erstellt werden, muss man mit der Eigenschaft prototype arbeiten:

Jedes Objekt, das man mit new X () erstellt, kennt nun diese Eigenschaft. Die gezeigte Vorgehensweise funktioniert auch bei Methoden.

Vererbung

Objekte können von anderen Objekten abstammen. Jedes Objekt erhält die Eigenschaften und Methoden des Objekts, von dem es abstammt. Dies nennt man Vererbung. Da JavaScript die Eigenschaft prototype verwendet, spricht man von einer prototypbasierten Vererbung. Mit dem folgenden Code sagt man, dass Y alle Eigenschaften von X erben soll.

Die Abhängigkeit zwischen X, Y und Z nennt man Prototypkette, da die Objekte über die Eigenschaft prototype miteinander verkettet sind. Am obersten Ende der Prototypkette steht immer das Object-Objekt, da alle Objekte letztendlich von Object abstammen.

Überschreiben

Wenn man eine Eigenschaft definiert, die es in einem übergeordneten Objekt bereits gibt, wird diese Eigenschaft überschrieben.

Y erbt hier von X und Z von Y. Diese Vererbung wird jedoch durch die Definition der Eigenschaften in dem oberen Teil des Codes überschrieben.

Auch Methoden kann man überschreiben.

Hier wird auch wieder die Vererbung überschrieben. Z erbt von Y und Y von X, jedoch werden innerhalb der Funktionen andere definiert, die dann die Vererbung überschreiben.

ECMAScript 5

Hiermit hat man einen höheren Einfluss auf das Verhalten von Objekten. Zum Beispiel kann man festlegen, ob der Wert einer Eigenschaft verändert werden kann, oder nicht. Hierzu verwendet man die Methode defineProperty(). Das erste Argument ist das Objekt, um das es geht und das Zweite gibt den Namen der Eigenschaft als String an. Das dritte Argument ist in Objekt, das verschiedene Attribute besitzen kann. Mit value legt man den Wert der Eigenschaft fest. Das Attribut writable gibt an, ob die Eigenschaft verändert werden kann (true/false).

Man kann aber stattdessen auch mit create() arbeiten:

Man kann jedoch auch ganze Objekte vor Veränderung schützen. Das geht durch die Methoden preventExtensions(), seal() und freeze(). So gibt es auch die Methoden, um den Zustand zu erfahren: isExtensible(), isSealed() und isFrozen(). preventExtensions() verhindert, dass ein Objekt nachträglich erweitert wird. Nach dem Aufruf der Methode seal() kann man das Objekt auch nicht mehr erweitern. Man kann aber auch keine Eigenschaften mit delete entfernen. Mit freeze() kann man ein Objekt einfrieren. Danach kann man an dem Objekt gar nichts mehr ändern.

Zugriffsmethoden definieren

defineProperty() kann auch dafür verwendet werden, um get– und set-Methoden zu definieren. Mit get und set kann man allerdings Attribute wie writable nicht mehr festlegen. Die set-Methode wird verwendet, wenn der Wert verändert werden soll. Zum Auslesen der Eigenschaft wird die get-Methode verwendet.

delete: Eigenschaften eines Objekts entfernen

ECMA 5 hat mit keys() und getOwnPropertyNames() zwei weitere Möglichkeiten alle Eigenschaften eines Objekts zu durchlaufen. Diese kommen jedoch, genau wie die for..in-Schleife zu unterschiedlichen Ergebnissen.

Im Zusammenhang mit defineProperty() kann man auch das Attribut enumerable angeben. Damit legt man fest, ob eine Eigenschaft bei der Verwendung einer for..in-Schleife oder der Methode keys() sichtbar sein soll (true/false). Wenn bei einer Eigenschaft nichts angegeben wird, ist sie automatisch auf enumerable true gesetzt. Die for..in-Schleife zeigt alle Eigenschaften, bei denen enumerable true ist. Die Methoden keys() und getOwnPropertyNames() beschränken sich auf das Objekt selbst und ignorieren damit die Propertykette. keys() liefert alle Eigenschaften, bei denen enumerable true ist. getOwnPropertyNames() liefert hingegen alle Eigenschaften, unabhängig vom enumerable-Attribut.

Der Strict Mode

ECMA 5 definiert einen Strict Mode. Wenn man beispielsweise versucht eine schreibgeschützte Eigenschaft zu verändern, wird diese im normalen Modus einfach ignoriert. Wenn man den Strict Mode verwendet, erzeugt der Browser jedoch eine Fehlermeldung. Der Strict Mode wird durch den String „use strict“; eingeschaltet. Dieser zwingt zu einer sauberen Programmierweise.