Magento 2 Experten — Hyvä Theme, Tailwind CSS & SEO aus einer Hand ›

Objektorientierte Programmierung mit Klassen in JavaScript

Objektorientierte Programmierung mit Klassen in JavaScript

~14 Min. Lesezeit Zuletzt aktualisiert am 8. August 2026

Mit class baut JavaScript eine vertraute, objektorientierte Syntax über sein eigentliches Prototyp-System (Kapitel 20). Wir modellieren jetzt ein Konto, das unser Haushaltsbuch strukturiert verwaltet.

Die erste Klasse: Konto

src/konto.js
export class Konto {
  constructor(name, startguthaben) {
    this.name = name;
    this.kontostand = startguthaben;
    this.transaktionen = [];
  }

  buchen(beschreibung, betrag, kategorie) {
    this.kontostand += betrag;
    this.transaktionen.push({ beschreibung, betrag, kategorie });
  }

  formatiereKontostand() {
    return `${this.name}: ${this.kontostand.toFixed(2)} EUR`;
  }
}
src/index.js
import { Konto } from './konto.js';

const konto = new Konto('Girokonto', 1500);
konto.buchen('Gehalt Januar', 2400, 'Gehalt');
konto.buchen('Miete Januar', -850, 'Miete');

console.log(konto.formatiereKontostand()); // 'Girokonto: 3050.00 EUR'
console.log(konto.transaktionen.length);    // 2

constructor läuft automatisch bei JEDEM new Konto(...)-Aufruf und initialisiert die Instanz-Eigenschaften. Methoden wie buchen() werden auf ALLE Instanzen der Klasse geteilt (über den Prototyp, Kapitel 20) – nicht bei jeder neuen Instanz neu erzeugt.

Getter und Setter

Berechnete Eigenschaften, die sich wie normale Eigenschaften ANFÜHLEN, aber tatsächlich Methoden sind:

class Konto {
  constructor(name, startguthaben) {
    this.name = name;
    this._kontostand = startguthaben; // Konvention: '_' signalisiert 'nicht direkt nutzen'
  }

  get kontostand() {
    return this._kontostand;
  }

  set kontostand(neuerWert) {
    if (neuerWert < 0) {
      throw new Error('Kontostand kann nicht negativ gesetzt werden');
    }
    this._kontostand = neuerWert;
  }
}

const konto = new Konto('Girokonto', 1500);
console.log(konto.kontostand); // 1500 - liest wie eine normale Eigenschaft, ruft aber get() auf
konto.kontostand = 2000;       // schreibt wie eine normale Eigenschaft, ruft aber set() auf
konto.kontostand = -50;        // Error: Kontostand kann nicht negativ gesetzt werden

Echte private Felder mit #

Seit ES2022 unterstützt JavaScript ECHTE Privatheit auf Sprachebene – anders als die _-Konvention oben (die nur eine STILISTISCHE Absicht ausdrückt, aber technisch weiterhin von außen zugreifbar ist), ist ein mit # markiertes Feld tatsächlich von AUSSERHALB der Klasse UNZUGREIFBAR:

class Konto {
  #kontostand; // echtes privates Feld

  constructor(name, startguthaben) {
    this.name = name;
    this.#kontostand = startguthaben;
  }

  get kontostand() {
    return this.#kontostand;
  }
}

const konto = new Konto('Girokonto', 1500);
console.log(konto.kontostand);   // 1500 - über den Getter
console.log(konto.#kontostand);  // SyntaxError - direkt von außen unmöglich!

Tipp: Dies ist die moderne, sprachnative Alternative zum Closure-basierten "privaten Zustand" aus Kapitel 16 – für Klassen ist # heute der bevorzugte Weg.

Statische Methoden und Eigenschaften

static-Mitglieder gehören zur KLASSE selbst, nicht zu einer einzelnen Instanz – nützlich für Hilfsfunktionen, die logisch zur Klasse gehören, aber keinen Zugriff auf eine konkrete Instanz brauchen:

class Konto {
  static WAEHRUNG = 'EUR';

  static erstelleLeeresKonto(name) {
    return new Konto(name, 0);
  }

  constructor(name, startguthaben) {
    this.name = name;
    this.kontostand = startguthaben;
  }
}

console.log(Konto.WAEHRUNG); // 'EUR' - Zugriff über die KLASSE, nicht über eine Instanz

const neuesKonto = Konto.erstelleLeeresKonto('Sparkonto');
console.log(neuesKonto.kontostand); // 0

class vs. Objektliteral: wann welches?

WerkzeugWann geeignet
Objektliteral (Kapitel 12)Für EINZELNE, einmalige Datenstrukturen ohne Verhalten oder mit wenig geteilter Logik – z. B. eine einzelne Transaktion.
classWenn MEHRERE gleichartige Instanzen mit gemeinsamem Verhalten (Methoden) und gekapseltem, geprüftem Zustand gebraucht werden – z. B. mehrere Konten mit Buchungslogik.