Start · Sprachen · JavaScript · Referenz · static

static

Keyword

Das Schlüsselwort <code>static</code> definiert Methoden, Felder oder Initialisierungsblöcke, die zur Klasse selbst gehören und nicht zu ihren Instanzen.

seit JavaScript ES2015 (statische Methoden), ES2022 (statische Fel Kategorie: syntax

Signatur

static methodName() { … } | static fieldName = value | static { … }

Beschreibung

Mit static markierte Elemente einer Klasse hängen am Konstruktor selbst, nicht am prototype. Man ruft sie über den Klassennamen auf (MyClass.method()), nicht über eine Instanz. Das passt gut für Hilfsfunktionen, Fabrikmethoden (User.fromJSON()), Konstanten, Caches oder Zähler, die für alle Instanzen gemeinsam gelten.

static lässt sich so einsetzen:

  • Statische Methoden: static create() { … }, auch als Getter/Setter (static get x()), Generator oder async-Methode.
  • Statische Felder: static count = 0; werden einmal ausgewertet, wenn die Klasse definiert wird.
  • Private statische Elemente: static #cache = new Map(); sind nur innerhalb des Klassenkörpers erreichbar.
  • Statische Initialisierungsblöcke: static { … } für komplexere Einmal-Initialisierung mit Anweisungen, try…catch und Zugriff auf private Elemente.

Innerhalb eines statischen Kontexts zeigt this auf den Konstruktor, also auf die Klasse selbst. Statische Elemente werden vererbt: Unterklassen können sie über super.method() aufrufen oder überschreiben, weil der Konstruktor der Unterklasse den Konstruktor der Elternklasse als Prototyp hat.

Parameter

Name Typ Default Beschreibung
$methodName / fieldName Pflicht Bezeichner | #privaterName | [berechneterSchlüssel] Name des statischen Elements. Erlaubt sind auch private Namen (#name) und berechnete Schlüssel ([Symbol.hasInstance]).
$value any undefined Anfangswert eines statischen Felds. Wird einmal bei der Klassendefinition ausgewertet, dabei ist this die Klasse.

Rückgabewert

Typ
void
Beschreibung
static ist ein Modifikator in der Syntax und liefert keinen Wert. Das Element wird als Eigenschaft direkt am Klassenkonstruktor angelegt.

Beispiele

Statische Fabrikmethode und Hilfsfunktion

class User {
  constructor(name, email) {
    this.name = name;
    this.email = email;
  }

  // Fabrikmethode: erzeugt eine Instanz aus JSON
  static fromJSON(json) {
    const { name, email } = JSON.parse(json);
    return new User(name, email);
  }

  static isValidEmail(email) {
    return /^[^@\s]+@[^@\s]+$/.test(email);
  }
}

const u = User.fromJSON('{"name":"Anna","email":"anna@example.de"}');
console.log(u.name);
console.log(User.isValidEmail(u.email));
console.log(typeof u.fromJSON); // nicht über die Instanz erreichbar
Anna true undefined

Statische Felder als Zähler und privater Cache

class Connection {
  static count = 0;
  static #pool = new Map();

  static get(url) {
    if (!this.#pool.has(url)) {
      this.#pool.set(url, new Connection(url));
    }
    return this.#pool.get(url);
  }

  constructor(url) {
    this.url = url;
    Connection.count++;
  }
}

const a = Connection.get('db://main');
const b = Connection.get('db://main');
console.log(a === b, Connection.count);
true 1

Statischer Initialisierungsblock

class Config {
  static defaults;
  static #secret;

  static {
    // mehrere Anweisungen und Fehlerbehandlung möglich
    try {
      this.defaults = JSON.parse('{"lang":"de","theme":"dark"}');
    } catch {
      this.defaults = {};
    }
    this.#secret = 'geheim';
  }

  static hasSecret() {
    return Boolean(Config.#secret);
  }
}

console.log(Config.defaults.lang, Config.hasSecret());
de true

Vererbung statischer Methoden mit super

class Shape {
  static describe() {
    return `Ich bin ${this.name}`;
  }
}

class Circle extends Shape {
  static describe() {
    return super.describe() + ' und rund';
  }
}

console.log(Shape.describe());
console.log(Circle.describe());
Ich bin Shape Ich bin Circle und rund

// Wichtig · Fallstricke

  • this-Falle: In statischen Methoden zeigt this auf die Klasse, über die aufgerufen wurde. Löst man die Methode heraus (const f = User.fromJSON; f()), ist this undefined, denn Klassen laufen immer im Strict Mode. Abhilfe schafft .bind(User) oder, dass man den Klassennamen direkt verwendet.
  • Private statische Elemente und Vererbung: this.#x in einer geerbten statischen Methode wirft einen TypeError, wenn sie über eine Unterklasse aufgerufen wird, weil #x nur am ursprünglichen Konstruktor existiert. Nutze in solchen Fällen den Klassennamen (Basis.#x).
  • Geteilter Zustand: Veränderbare statische Felder (Objekte, Arrays) gelten nur für die Klasse, in der sie definiert sind. Eine Unterklasse, die schreibend über this.feld = … zugreift, legt eine eigene Eigenschaft an und verdeckt damit das geerbte Feld.
  • Instanzen haben keinen direkten Zugriff auf statische Elemente. Nimm this.constructor.method() oder den Klassennamen.
  • static ist nur innerhalb eines Klassenkörpers erlaubt, nicht in Objektliteralen oder Funktionen.
  • Kompatibilität: Statische Methoden gibt es seit ES2015 in allen Browsern. Statische Felder, private statische Elemente und static {}-Blöcke (ES2022) werden von allen aktuellen Browsern unterstützt (Chrome 94+, Firefox 93+, Safari 16.4+) und von Node.js 16.11+. Für ältere Umgebungen brauchst du einen Transpiler wie Babel oder TypeScript.

Siehe auch