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 |