Typen in TypeScript erweitern: Leistung und Tricks

Kann man Typen in TypeScript erweitern? Eintauchen in Leistung und Optimierung

Hallo, Freund! Wenn du jemals in TypeScript geschrieben hast, bist du sicherlich auf die Frage gestoßen: "Kann man Typen genauso erweitern wie Interfaces?" Diese Frage hat auf Stack Overflow Tausende von Aufrufen gesammelt, und das zu Recht. Es scheint einfach: Interfaces werden mit extends erweitert, Typen mit Schnittmengen (&). Aber es gibt Nuancen, die sich direkt auf die Leistung und Lesbarkeit des Codes auswirken.

Heute werden wir uns ansehen, wie man Typen in TypeScript erweitert, wie sich dies von Interfaces unterscheidet und wie man bei der Optimierung keine Fehler macht. Los geht's!

Type vs Interface: Der ewige Kampf

Bevor wir über die Erweiterung sprechen, erinnern wir uns an den Unterschied. Interfaces sind "Verträge", die mehrfach deklariert werden können (deklarative Zusammenführung), während Typen Aliase für beliebige Formen sind. Beide können erweitert werden, aber auf unterschiedliche Weise.

Wie erweitert man Interfaces?

Das ist bekannt:

interface Animal {  name: string;}

interface Bear extends Animal {  honey: boolean;}

const bear: Bear = { name: 'Winnie', honey: true };

Einfach, elegant, funktioniert. Aber was, wenn wir dasselbe für einen Typen wollen?

Wie erweitert man Typen?

Typen unterstützen extends nicht direkt. Stattdessen wird der Schnittmengen-Operator (&) verwendet:

type Animal = {  name: string;};

type Bear = Animal & { honey: boolean };

const bear: Bear = { name: 'Winnie', honey: true };

Sieht ähnlich aus, aber es gibt Fallstricke. Schauen wir sie uns anhand von Beispielen an.

Leistung: Was ist schneller?

Die Millionen-Dollar-Frage: Beeinflusst die Wahl zwischen interface extends oder type & die Kompilierungs- und Ausführungsgeschwindigkeit? Spoiler: Ja, aber nicht so, wie du denkst.

Kompilierung: Interfaces gewinnen

TypeScript kompiliert Interfaces schneller als Typ-Schnittmengen. Warum? Interfaces sind "flache" Strukturen, die der Compiler cachen und linear verarbeiten kann. Typ-Schnittmengen sind komplexe Konstrukte, die eine rekursive Entfaltung erfordern können.

// Interface - schnellinterface A { a: string }interface B extends A { b: number }

// Typ - langsamertype A = { a: string }type B = A & { b: number }

In großen Projekten mit Hunderten von Typen kann der Unterschied spürbar sein. Aber wenn du 10-20 Entitäten hast, wirst du ihn nicht bemerken.

Ausführung: Kein Unterschied

TypeScript ist ein Overlay über JavaScript. Zur Laufzeit gibt es weder Interfaces noch Typen. Sie existieren nur während der Entwicklung. Daher hat die Wahl keinerlei Einfluss auf die Ausführungsgeschwindigkeit des Programms.

Wann sind Typen besser als Interfaces?

Trotz der potenziell langsameren Kompilierung sind Typen in einigen Szenarien unverzichtbar:

• Union Types — Typvereinigung (z. B. string | number)
• Conditional Types — Bedingte Typen (z. B. T extends string ? 'yes' : 'no')
• Mapped Types — Eigenschaftstransformation (z. B. { [K in keyof T]: boolean })

Interfaces können das nicht. Aber wenn du nur ein Objekt erweitern musst, sind Interfaces die erste Wahl.

Optimierung: Wie man sich nicht ins Bein schießt

Kommen wir zum Interessantesten. Wie schreibt man erweiterbare Typen, ohne die Kompilierung zu verlangsamen und Kollegen zu verwirren?

Regel 1: Verwende Interfaces für Objekte, Typen für alles andere

Das ist der Goldstandard. Wenn du die Form eines Objekts beschreibst, nimm interface. Wenn du einen Union, Intersection oder Magie mit Generics brauchst, nimm type.

// Gutinterface User {  id: number;  name: string;}

type Status = 'active' | 'inactive';type Admin = User & { role: 'admin' };<