Javascript Object Prototype

Prototype – Vorlage , von der alle Instanzen Eigenschaften und Methoden erben

Alle Javascript-Objekte ((Date, Array, RegExp, Function, …)) erben Eigenschaften und Methoden von Object.prototype, das gilt sowohl für selbstgemachte Objekte als auch für die vorgefertigten Objekte. So erben z.B. Date-Objekte von Date.prototype, Arrays von Array.prototype und auch die DOM-Objekte, die Element, Event, Document und weitere Schnittstellen des Document Model Objects darstellen.

Wenn ein neues Objekt angelegt wird, hat es eine Referenz zu seinem Vorfahren oder Vorbild. Der Vorfahre ist der Prototyp – die Vorlage, von der alle Instanzen Eigenschaften und Methoden erben und weitere Eigenschaften und Methoden hinzufügen können.

function Spaceship (name, build, age) {
    this.name = name;
    this.baujahr = build;
    this.age = age;
}

Mit einer Konstruktor-Funktion (der Name von Kontruktor-Funktionen beginnt üblicherweise mit einem Großbuchstaben) und new werden neue Objekte vom selben Prototypen angelegt.

let voyager    = new Spaceship ("Voyager", "2400", 7);
let enterprise = new Spaceship ("Enterprise", "2200", 5);

Neue Eigenschaft hinzufügen

voyager.captain = "Janeway";

Die Eigenschaft wird nur zu voyager hinzugefügt, nicht aber zu enterprise.

[Log] Spaceship {name: "Voyager", baujahr: "2400", age: 7, captain: "Janeway"} 
[Log] Spaceship {name: "Enterprise", baujahr: "2200", age: 5}

Dem Prototyp kann eine neue Eigenschaft nicht derart locker hinzugefügt werden wie einem Objekt, denn der Prototyp ist kein existierendes Objekt.

function Spaceship (name, build, age, captain) {
   this.name = name;
   this.baujahr = build;
   this.age = age;
   this.captain = captain;
}

Das ist ein einfaches Muster für das Erzeugen und die Wiederverwertung von Objekten. Die Vererbung erzeugt eine Kette, die zurückreicht bis zum grundlegenden object.prototype. Neue Eigenschaften müssen in die Prototyp-Funktion geschrieben werden.

newObject foo Spaceship foo

Hat das neue Objekt eine Eigenschaft foo, dann wird die Kette der Vorgänger nicht konsultiert. Wenn der Zugriff fehlschlägt, folgt Javascript der Kette der Vorgänger.

Änderungen im alten Objekt schlagen sofort auf die abgeleiteten Objekte durch, aber Änderungen in abgeleiteten Objekten berühren die Vorgänger nicht.

Methoden hinfügen

function Spaceship (name, build, age, captain) {
   this.name = name;
   this.baujahr = build;
   this.age = age;
   this.captain = captain;
   this.mission = function() {
      return "Raumschiff " + this.name + " Neue Welten entdecken";
    };
}

let voyager    = new Spaceship ("Voyager", "2400", 7, "Janeway");
let enterprise = new Spaceship ("Enterprise", "2200", 5, "Kirk");

console.log(voyager.mission());
Raumschiff Voyager Neue Welten entdecken

Eigenschaften und Methoden mittels prototype-Eigenschaft hinzufügen

Eigenschaften

Spaceship.prototype.crew = 400;

Methoden

Spaceship.prototype.mission = function() {
    return "Neue Welten erforschen";
};
object prototype PROTOTYPE