class
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2016.
Die class
-Deklaration erstellt eine Bindung einer neuen Klasse zu einem gegebenen Namen.
Sie können Klassen auch mit dem class
-Ausdruck definieren.
Probieren Sie es aus
Syntax
class name {
// class body
}
class name extends otherName {
// class body
}
Beschreibung
Der Klassenrumpf einer Klassendeklaration wird im strict mode ausgeführt. Die class
-Deklaration ist sehr ähnlich der let
-Deklaration:
class
-Deklarationen sind sowohl auf Blöcke als auch auf Funktionen beschränkt.class
-Deklarationen können nur nach Erreichen des Deklarationsortes zugegriffen werden (siehe temporäre Totzone). Aus diesem Grund geltenclass
-Deklarationen allgemein als nicht-hoistisch (im Gegensatz zu Funktionsdeklarationen).class
-Deklarationen erstellen keine Eigenschaften aufglobalThis
, wenn sie auf der obersten Ebene eines Skripts deklariert werden (im Gegensatz zu Funktionsdeklarationen).class
-Deklarationen können nicht durch eine andere Deklaration im selben Gültigkeitsbereich erneut deklariert werden.
Außerhalb des Klassenkörpers können class
-Deklarationen wie let
neu zugewiesen werden, aber dies sollte vermieden werden. Innerhalb des Klassenkörpers ist die Bindung konstant wie const
.
class Foo {
static {
Foo = 1; // TypeError: Assignment to constant variable.
}
}
class Foo2 {
bar = (Foo2 = 1); // TypeError: Assignment to constant variable.
}
class Foo3 {}
Foo3 = 1;
console.log(Foo3); // 1
Beispiele
Eine Klassendeklaration
Im folgenden Beispiel definieren wir zunächst eine Klasse namens Rectangle
und erweitern sie dann, um eine Klasse namens FilledRectangle
zu erstellen.
Beachten Sie, dass super()
, das im constructor
verwendet wird, nur in Konstruktoren verwendet werden kann und muss aufgerufen werden, bevor das Schlüsselwort this
verwendet werden kann.
class Rectangle {
constructor(height, width) {
this.name = "Rectangle";
this.height = height;
this.width = width;
}
}
class FilledRectangle extends Rectangle {
constructor(height, width, color) {
super(height, width);
this.name = "Filled rectangle";
this.color = color;
}
}
Spezifikationen
Specification |
---|
ECMAScript Language Specification # sec-class-definitions |
Browser-Kompatibilität
BCD tables only load in the browser