Objekte & Prototypen

Objekte sind in JavaScript Sammlungen von Schlüssel-Wert-Paaren. Vererbung funktioniert über Prototypen: Jedes Objekt verweist intern ([[Prototype]]) auf ein anderes Objekt und erbt dessen Eigenschaften. Wer das Prinzip kennt, versteht auch class, this und die Suche nach Methoden.

Objekt-Literale

const user = {
  name: 'Ada',
  age: 36,
  greet() {
    return `Hallo, ${this.name}`;
  },
};

const { name, ...rest } = user;
const copy = { ...user, age: 37 };

Der Spread-Operator erstellt nur eine flache Kopie. Für tiefe Kopien gibt es structuredClone().

Die Prototypenkette

Fehlt eine Eigenschaft am Objekt selbst, sucht die Engine im Prototyp weiter. Das geht so lange, bis sie null erreicht.

const animal = {
  speak() { return `${this.name} macht ein Geräusch`; },
};

const dog = Object.create(animal);
dog.name = 'Rex';

dog.speak();                           // 'Rex macht ein Geräusch'
Object.getPrototypeOf(dog) === animal; // true
Object.hasOwn(dog, 'speak');           // false

__proto__ ist veraltet. Nutze stattdessen Object.getPrototypeOf() und Object.setPrototypeOf(). Den Prototyp zur Laufzeit zu ändern macht den Code allerdings langsam.

Klassen als Syntax-Zucker

class baut dieselbe Prototypenstruktur auf, nur lesbarer. Methoden landen auf Klasse.prototype.

class Animal {
  #id = crypto.randomUUID(); // privates Feld
  constructor(name) { this.name = name; }
  speak() { return `${this.name} macht ein Geräusch`; }
}

class Dog extends Animal {
  speak() { return `${super.speak()} – Wuff!`; }
}

const rex = new Dog('Rex');
rex instanceof Animal; // true
Object.getPrototypeOf(Dog.prototype) === Animal.prototype; // true

Fallstricke

• for...in durchläuft auch geerbte Eigenschaften. Besser sind Object.keys() oder Object.entries().
• Arrow Functions als Methoden haben kein eigenes this.
• Object.create(null) erzeugt ein Objekt ohne Prototyp. Das eignet sich als reines Dictionary. Oft ist aber Map die bessere Wahl.