Dieclass-Deklaration erstellt eineBindung einer neuenKlasse an einen gegebenen Namen.

Sie können Klassen auch mit demclass-Ausdruck definieren.

Probieren Sie es aus

class Polygon {  constructor(height, width) {    this.area = height * width;  }}console.log(new Polygon(4, 3).area);// Expected output: 12

Syntax

class name {  // class body}class name extends otherName {  // class body}

Beschreibung

Der Klassenrumpf einer Klassendeklaration wird imStrict Mode ausgeführt. Dieclass-Deklaration ist derlet-Deklaration sehr ähnlich:

• class-Deklarationen sind sowohl auf Blöcke als auch auf Funktionen beschränkt.
• class-Deklarationen können erst nach Erreichen des Deklarationsorts zugegriffen werden (siehetemporäre tote Zone). Aus diesem Grund werdenclass-Deklarationen allgemein alsnicht-gehoisted angesehen (im Gegensatz zuFunktionsdeklarationen).
• class-Deklarationen erzeugen keine Eigenschaften aufglobalThis, wenn sie auf oberster Ebene eines Skripts deklariert werden (im Gegensatz zuFunktionsdeklarationen).
• class-Deklarationen können nicht durch irgendeine andere Deklaration im selben Bereichneu deklariert werden.

Außerhalb des Klassenkörpers könnenclass-Deklarationen wielet neu zugewiesen werden, aber Sie sollten dies vermeiden. Innerhalb des Klassenkörpers ist die Bindung konstant wieconst.

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 zuerst eine Klasse namensRectangle und erweitern sie dann, um eine Klasse namensFilledRectangle zu erstellen.

Beachten Sie, dasssuper(), das imKonstruktor verwendet wird, nur in Konstruktoren verwendet werden kann undmuss aufgerufen werden,bevor das Schlüsselwortthis 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

Browser-Kompatibilität

Siehe auch

• function
• class-Ausdruck
• Klassen