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.

We’d love to hear your thoughts on the next set of proposals for the JavaScript language. You can find a description of the proposals here.

Please take two minutes to fill out our short survey.

Die class-Deklaration erstellt eine Bindung einer neuen Klasse mit einem gegebenen Namen.

Sie können Klassen auch mithilfe des class Ausdrucks 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 Klassenkörper einer Klassendeklaration wird im strict mode ausgeführt. Die class-Deklaration ist sehr ähnlich zu let,

class-Deklarationen sind auf Blöcke sowie Funktionen beschränkt.
class-Deklarationen können nur nach ihrem Deklarationsort erreicht werden (siehe temporal dead zone). Aus diesem Grund werden class-Deklarationen allgemein als nicht gehoben angesehen (im Gegensatz zu Funktiondeklarationen).
class-Deklarationen erstellen keine Eigenschaften auf globalThis, wenn sie auf der obersten Ebene eines Skripts deklariert werden (im Gegensatz zu Funktiondeklarationen).
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 Sie sollten dies vermeiden. Innerhalb des Klassenkörpers ist die Bindung wie const konstant.

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 namens Rectangle und erweitern sie dann, um eine Klasse namens FilledRectangle zu erstellen.

Beachten Sie, dass super(), wie im constructor verwendet, 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® 2026 Language Specification # sec-class-definitions