Mozilla's getting a new look. What do you think? https://mzl.la/brandsurvey

Erweitern

Das extends Schlüsselwort wird in einer Klassendeklaration oder in einem Klassenausdruck verwendet, um eine, von einer anderen Klasse, abgeleitete Klasse zu erzeugen.

Syntax

class KindKlasse extends ElternKlasse { ... }

Beschreibung

Das Schlüsselwort extends kann verwendet werden, um von selbst erstellen Klassen als auch von standardmäßig eingebaute Objekte abzuleiten.

Das prototype Objekt, des zu erweiternden Objekt, muss entweder von Typ Object odernull sein.

Beispiele

Verwendung von extends

Das erste Beispiel erzeugt einen Klasse mit dem Namen Square, die von der Klasse Polygon abgeleitet ist. Dieses Beispiel wurde aus dieser live Demo (Quellecode) entnommen.

class Square extends Polygon {
  constructor(length) {
    // Hier wird die constructor Methode der Eltern-Klasse aufgerufen,
    // für die Parameter width und height wurde der übergebene length Parameter verwendet
    super(length, length);
    // Anmerkung: In abgeleiteten Klassen, muss die super() Methode aufgerufen werden,
    // bevor man das 'this' Objekt verwenden kann, da es sonst zu einen Referenz Fehler kommt
    this.name = 'Square';
  }

  get area() {
    return this.height * this.width;
  }

  set area(value) {
    this.height = this.width = Math.sqrt(value);
    this.area = value;
  } 
}

Verwendung mit standardmäßig eingebaute Objekt

In diesem Beispiel wird das standardmäßig eingebaute Date Objekt erweitert. Dieses Beispiel wurde aus dieser live Demo (Quellecode) entnommen.

class myDate extends Date {
  constructor() {
    super();
  }

  getFormattedDate() {
    var months = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
    return this.getDate() + "-" + months[this.getMonth()] + "-" + this.getFullYear();
  }
}

Ableiten von null

Das Ableiten von null funktioniert genauso wie mit jeder anderen Klasse, mit der Ausnahme, dass das prototype Objekt nicht von Object.prototype abgeleitet ist.

class nullExtends extends null {
  constructor() {}
}

Object.getPrototypeOf(nullExtends); // Function.prototype
Object.getPrototypeOf(nullExtends.prototype) // null

Spezifikationen

Spezifikation Status Kommentar
ECMAScript 2015 (6th Edition, ECMA-262)
Die Definition von 'extends' in dieser Spezifikation.
Standard Initiale Definition.
ECMAScript 2017 Draft (ECMA-262)
Die Definition von 'extends' in dieser Spezifikation.
Entwurf  

Browserkompatibilität

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 42.0 45 (45) ? ? ?
Array subclassing 43.0 Nicht unterstützt ? ? ?
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support Nicht unterstützt 45.0 (45) ? ? ? 42.0
Array subclassing Nicht unterstützt Nicht unterstützt ? ? ? 43.0

Siehe auch

Schlagwörter des Dokuments und Mitwirkende

Schlagwörter: 
 Mitwirkende an dieser Seite: schlagi123, akumagamo
 Zuletzt aktualisiert von: schlagi123,