Neben der Literalschreibweise, gibt es eine weitere Möglichkeit Objekte zu erzeugen und zwar mittels einer Konstruktorfunktion. Das hat den Vorteil, dass man damit mehrere Instanzen bilden kann.
Mit dem Schlüsselwort new
und dem Aufruf der Konstruktorfunktion, erzeugt man aus einer Klasse eine Instanz dieser Klasse, ein Objekt.
function Saurier(){}
Wenn man typeof new Saurier()
abfragt, erhält man als Ergebnis object
.
Man kann also mit Javascript irgendeine Funktion nehmen und mit new ein Objekt daraus erzeugen. Eine normale Funktion wird durch das Schlüsselwort new
zur Konstruktorfunktion.
Mit this hat man die Möglichkeit Eigenschaften des Objekts innerhalb der Konstruktorfunktion zu definieren.
Erzeugt man ein Objekt davon, kann man die Eigenschaften abfragen.
function Saurier(){
this.beine = 2;
this.laenge = 6;
}
var trex = new Saurier();
console.log(trex.laenge);//6
Man kann auch die Array Notation [] benutzen und die Eigenschaften mit einer for-in Schleife durchlaufen.
for( i in trex){
document.getElementById("anzeige").innerHTML += i+" , "+trex[i]+"<br>";
}
Es lassen sich auch Methoden einfügen, entweder mittels einer anonymen Funktion oder einer Callback Funktion.
function Saurier(){
this.beine = 2;
this.laenge = 6;
this.schrei = "rooaaarrrr";
this.bruellen = function(){alert(this.schrei);}
}
var trex = new Saurier();
trex.bruellen();
Mit der Konstruktorfunktion hat man die Möglichkeit, dem Objekt beim Initiieren Werte zuzuweisen. In diesem Beispiel, die Anzahl der Beine, die Länge, das Brüllgeräusch. Beachte, dass die Eigenschaftren der Klasse mit this
. beginnen und die Parameter den gleichen Bezeichner haben können, aber nicht müssen. Um das deutlich zu machen, habe ich den Bezeichner laut für die Eigenschaft schrei gewählt.
function Saurier ( beine, laenge, laut ) { this.beine = beine; this.laenge = laenge; this.schrei = laut; this.bruellen = function () { alert( this.schrei ); } } var trex = new Saurier( 2, 6, "rooaarrrr" ); let stegosaurus = new Saurier( 4, 7, "grunz" ); trex.bruellen(); stegosaurus.bruellen();
siehe Beispiel
Um Funktionen von Konstruktorfunktionen zu unterscheiden ist es Konvention, dass man die Bezeichner in Konstruktorfunktionen groß schreibt.
Auf der Seite Datentypen, bin ich auf die Operatoren typeof
und instanceof
eingegangen.
Wendet man diese Operatoren auf das obige Beispiel an, erhält man folgendes:
console.log(typeof trex) // Object console.log(trex instanceof Saurier) // true
Das Erzeugen von Objekten / Instanzen von Klassen kennen Sie schon vom Erzeugen eines Arrays beispielsweise.
let ar = new Array();
Hierbei ist Array()
ein Funktionsaufruf und im weiteren Sinne der Aufruf der Konstruktorfunktion. Array
ist die "Klasse". Hier wird aus einer Klasse ein Objekt erzeugt.
Was zeichnet in Javascript eine Konstruktorfunktion im Gegensatz zu einer normalen Funktion aus? Gar nichts. Durch das Schlüsselwort new wird daraus eine Konstruktorfunktion. Ruft man die Funktion als Konstruktorfunktion auf, liefert sie eine neue Objektinstanz. Dazu ist kein return notwendig.