Kontakt aufnehmen

Objekte in JavaScript

Objekte sind ein wesentlicher Bestandteil von JavaScript und JScript. Sie haben bestimmte Eigenschaften und stellen Methoden zur Verfügung.

Standardobjekte

Beide Sprachen ( JavaScript wie auch JScript) stellen selbst eigene Objekte zur Verfügung. Diese Standardobjekte sind in etwa bei beiden gleich (bis auf wenige Ausnahmen). Sie sind als eine Art Biliothek zu verstehen, die nützliche Eigenschaften und Methoden enthalten und können jederzeit verwendet werden ohne vorher erstellt zu werden. Zu den Standardobjekten gehören u.A. Array, String, Date und Math.

Mehr Informationen zu den einzelnen Objekten finden Sie in der Objektübersicht.

JavaScript 1.1 JScript 2.0 Eigene Objekte

Neben den Vorgegebenen Objekten können auch eigene geschaffen werden. Dies geschieht über eine ganz normale Funktion, die Sie selbst definieren müssen. Ein neues Objekt kann auf zwei Weisen erstellt werden.

JavaScript 1.1 JScript 2.0 Einfache Objekte

Ein einfaches Objekt (also eine Zusammenfassung von Eigenschaften) wird durch die Zuweisung dieser Eigenschaften zu einer Variablen erstellt. Dabei wird als Erstes eine Variable notiert, die als Objekt fungieren soll. Dieser Variablen wird nun etwas (die Eigenschaften) zugewiesen. Danach folgt nun die Beschreibung des Objekts innerhalb von geschweiften Klammern ( { und } ). Diese Beschreibung ist im Prinzip nur eine einfache Auflistung der Eigenschaften und Methoden des betreffenden Objekts. Dabei wird jeweils als Erstes der Name der Eigenschaft/Methode notiert, gefolgt von einem Doppelpunkt (:). Hinter diesem folgt dann der Wert bzw. die auszuführende Funktion. Mehrere Eigenschaften oder Methoden werden durch Kommans (,) voneinander getrennt. Methoden werden ohne Klammern und Parameter notiert (Also statt Name : Funktion(a,b,c) einfach Name : Funktion). Beispiel:

function MachWas(val)
{ /*Anweisungen*/ }

meinAuto {
          Marke : 'VW',
          Baujahr : 1956,
          Farbe : '#008000',
          ReifenWechsel : MachWas
         } 

Erklärung: Im Beispiel wird ein neues Objekt meinAuto erstellt. Dieses Objekt erhält die Eigenschaften Marke, Baujahr und Farbe (mit den jeweiligen Werten) sowie die Methode ReifenWechsel. Die Eigenschaften können dann jederzeit über das Objekt abgefragt (z.B. meinAuto.Baujahr) und die Methoden gestartet werden (z.B. meinAuto.ReifenWechsel(Wert)).
Vergessen Sie beim Aufruf von Methoden jedoch nicht eventuelle Parameter zu übergeben, auch wenn diese nicht beschrieben wurden.

JavaScript 1.1 JScript 2.0 Komplexe Objekte

Ein komplexeres Objekt kann mit dem new-Operator erstellt werden. Wird einer Variablen mit dem new-Operator eine Funktion zugewiesen, so wird der Variablen ein neues Objekt mit den in der Funktion definierten Eigenschaften erstellt. Innerhalb der aufgerufenen Funktion können die Eigenschaften und Methoden benannt werden, indem mit this. sowie dem jeweiligen Namen ein Wert bzw. eine Funktion zugewiesen wird. Beispiel:

function ErstelleSchrank(a,b,c,d,e)
{
 this.Farbe = a;
 this.Stil = b;
 this.Jahr = c;
 this.Hoehe = 210;
 this.Tuer = new ErstelleSchrankTuer(d,e)
}

function ErstelleSchrankTuer(f,g)
{
 this.Breite = f;
 this.Hoehe = g;
}

Schrank = new ErstelleSchrank('rot','klassisch',1999,80,190); 

Erklärung: Im Beispiel wird mit dem new-Operator ein neues Objekt Schrank erstellt. Diesem Objekt werden innerhalb der Funktion ErstelleSchrank bestimmte Eigenschaften zugewiesen (Jahr, Hoehe, Stil, Farbe). Des Weiteren wird ein Unterobjekt Tuer erstellt, welchem ebenfalls Eigenschaften zugewiesen werden.
Die Eigenschaften (und eventuelle Methoden) können dann über das Objekt Schrank bzw. dessen Unterobjekt Schrank.Tuer abgefragt werden (z.B. Schrank.Jahr oder Schrank.Tuer.Hoehe).

JavaScript 1.2 JScript 3.0 Vererbung

Mit Hilfe der prototype-Eigenschaft, die jedes Objekt automatisch besitzt, ist es möglich einem Objekt die Eigenschaften eines anderen Objektes (zusätzlich zu den eigenen) zu geben. Dazu wird der prototype-Eigenschaft eines Objektes ein neues Objekt erstellt. Das erste Objekt ist dann vom Typ des zweiten und enthält zusätzlich zu den eigenen die Eigenschaften und Methoden des anderen. Beispiel:

function Fahrzeug(a,b)
{
 this.name = a;
 this.jahr = b;
}

function Auto(c)
{ this.marke = c; }
Auto.prototype = new Fahrzeug('Auto',2000)

function Volkswagen(d)
{ this.ps = d; }
Volkswagen.prototype = new Auto('VW');

meinAuto = new Volkswagen(55);

Erklärung: Im Beispiel wird ein neues Objekt meinAuto erstellt. Dieses wird vom Typ Volkswagen sein und erhält demendsprechend dessen Eigenschaften und Methoden. Da der Typ Volkswagen wiederum vom Typ Auto ist, haben die Objekte vom Typ Volkswagen auch die Eigenschaften des Typs Auto. Da nun wiederum der Typ Auto vom Typ Fahrzeug ist, enthalten wiederum alle abgeleiteten Typen dessen Eigenschaften. Das Objekt meinAuto erhält somit die Eigenschaften von den Typen Volkswagen, Auto und Fahrzeug.

JavaScript 1.2 JScript 3.0 Alternative Werte

Neben den festen Werten kann auch ein alternativer Wert für eine Eigenschaft definiert werden. Dieser Alternativwert wird, durch zwei Abwärzstriche (||) vom eigentlichen Wert getrennt, dahinter notiert. Tritt der Fall ein, dass der eigentliche Wert nicht eingesetzt werden kann (z.B. weil er undefiniert oder nicht existent ist) wird der Eigenschaft der Alternativwert zugewiesen. Beispiel:

function Hund(a,b)
{
 this.Rasse = a || 'Schäferhund';
 this.Farbe = b || 'braun';
}

meinHund = new Hund('Pudel'); 

Erklärung: Im Beispiel wird ein neues Objekt meinHund erstellt. Dazu sollten zwei Werte (a und b) übergeben werden. Da allerdings nur ein Wert (also a) definiert ist und somit die Eigenschaft Farbe des Objektes undefiniert wäre, wird automatisch der Alternativwert ('braun') als Wert verwendet. Das Objekt meinHund hat also die Eigenschaften Rasse mit dem Wert 'Pudel' und Farbe mit dem Wert 'braun'.

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Weiterlesen: ⯈ Ereignisse

Über uns

Stefan Wienströer

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project

Cookie-Einstellungen

Helfen Sie dabei, uns noch besser zu machen. Wir nutzen Cookies und ähnliche Technologien, um die Website auf Ihre Bedürfnisse anzupassen. Zur Datenschutzerklärung

Auswahl speichern