Objekte / Klassen / Konstruktorfunktion

Javascript ist zwar keine objektorientierte Programmiersprache, aber man kann Objekte und so etwas ähnliches wie Klassen erzeugen.

In objektorientierten Programmiersprachen gibt es Klassen und von diesen Klassen kann man mehrere Instanzen / Objekte erzeugen.

In einer Klasse werden die Eigenschaften und Methoden und Ereignisse dieser Klasse definiert. z.B. Man definiert eine Klasse Auto mit Eigenschaften wie felge, farbe, tueren und Methoden wie fahren(), bremsen(), lenken() Ereignisse wie lichtAn, starten, gasPedalDruck ,

Dieses Beispiel wird häufig verwendet, um zu zeigen, dass dieses Konzept bewußt die Dinge aus der realen Welt nachempfindet, um damit komplexe Programme verständlich und übersichtlich zu machen.

var Auto = function(flg, frb, rad)
{
    this.felge = flg;
    this.farbe = frb;
    this.raeder = rad; 
}

Von der Klasse Auto kann man dann mit dem Schlüsselwort new mehrere Instanzen/Objekte erzeugen. Hierbei können die Eigenschaftswerte unterschiedlich sein, farbe = rot, farbe = grün, etc. Wenn man ein neues Objekt erzeugt werden in der Konstruktorfunktion die Eigenschaften mit verschiedenen Werten belegt.Auto('chrom', 'rot', 4)Die Konstruktorfunktion ist also eine Startfunktion.

let myCar = new Auto('chrom', 'rot', 4);

In diesem Beispiel haben wir folgende Eigenschaften:

myCar.farbe ='rot', myCar.felge = 'chrom'

Auch in Javascript kann man aus einer "Klasse" ein Objekt erzeugen.

Eine Möglichkeit ein Objekt zu erzeugen besteht darin das Schlüsselwort new und die Konstruktorfunktion zu nutzen. Vielleicht kennen Sie schon diese Syntax vom Erzeugen eines Array.

let ar = new Array();

Hierbei ist Array() ein Funktionsaufruf und im weiteren Sinne eine Konstruktorfunktion. Array ist die "Klasse", denn hier wird aus einer Klasse ein Objekt erzeugt.

Was zeichnet in Javascript eine Konstruktorfunktion im Gegensatz zu einer normalen Funktion aus? Gar nichts. Wenn man folgendes macht hat man eine Konstruktorfunktion und somit die Basis einer Klasse geschrieben.

function MeinKonstruktor(){

}

Wenn man mittels typeof abfragt, erhält man als Ergebnis objekt.

document.getElementById("anzeige").innerHTML = typeof new MeinKonstruktor();

siehe Beispiel

Man kann also mit Javascript irgendeine Funktion nehmen und mit new ein Objekt daraus erzeugen. Mit this hat man die Möglichkeit Eigenschaften des Objekts innerhalb der Konstruktorfunktion zu erzeugen.

Erzeugt man ein Objekt davon, kann man die Eigenschaften abfragen.

function MeinKonstruktor(){
this.eigenschaft1 = "blue"
this.eigenschaft2 = 30;
}

var a = new MeinKonstruktor();
document.getElementById("anzeige").innerHTML = a.eigenschaft1;

siehe Beispiel

Man kann auch die Array Notation benutzen und die Eigenschaften mit einer for-in Schleife durchlaufen.

for( i in a){
document.getElementById("anzeige").innerHTML += i+" , "+a[i]+"<br>";
}

siehe Beispiel

Es lassen sich auch Methoden einfügen, entweder mittels einer anonymen Funktion oder einer Callback Funktion.

function MeinKonstruktor(){
this.eigenschaft1 = "blue"
this.eigenschaft2 = 30;
this.methode1 = function(){alert("eigenschaft1 ist" + this.eigenschaft1);}
}
var a = new MeinKonstruktor();
a.methode1();

siehe Beispiel

Groß und Kleinschreibung

Um Funktionen von Konstruktorfunktionen zu unterscheiden ist es Konvention, dass man die Bezeichner in Konstruktorfunktionen groß schreibt.


Javascript Tipps