ProgrammierungFullstack-Entwickler

Wie funktioniert die Erweiterung von Typen (extends), welche Nuancen gibt es bei der Verwendung mit Typen und Schnittstellen, und wie beeinflusst dies die Struktur Ihres Projekts?

Bestehen Sie Vorstellungsgespräche mit dem Hintsage-KI-Assistenten

Antwort

In TypeScript können Typen sowohl durch interface extends als auch durch type & type (Schnittmengentypen) erweitert werden. Schnittstellen können Typen erweitern und umgekehrt.

Schnittstellen verwenden das Schlüsselwort extends, um Eigenschaften zu erben:

interface Animal { name: string; } interface Bird extends Animal { wings: number; }

Typen können durch & kombiniert werden:

type Animal = { name: string }; type Bird = Animal & { wings: number };

Zudem kann eine Schnittstelle einen anderen Typ erweitern:

type Base = { id: number }; interface Derived extends Base { description: string; }

Besonderheiten:

  • Schnittstellen unterstützen deklaratives Merging (declaration merging), Typen nicht.
  • Schnittstellen werden empfohlen, wenn die Erweiterung anderer Entitäten erwartet wird (z.B. für Bibliotheken).
  • Geschachtelte extends können zu komplexen Hierarchien führen, die Wartung erschweren und Namenskonflikte verursachen.

Fangfrage

Kann ein Typ (type) durch eine Schnittstelle erweitert werden oder umgekehrt? Welchen Fehler machen die meisten?

Viele glauben, dass nur Schnittstellen durch Schnittstellen erweitert werden können, aber tatsächlich kann eine Schnittstelle einen Typ erweitern:

type Basic = { flag: boolean }; interface Extra extends Basic { name: string; }

Ein Typ kann jedoch andere Typen nicht durch extends erweitern — nur durch Schnittmengentypen (&).

Beispiele für reale Fehler aufgrund mangelnden Wissens über die Feinheiten des Themas


Geschichte

In einem großen Projekt wurden Schnittstellen durch extends zusammengeführt, wobei vergessen wurde, dass gleichnamige Eigenschaften im Typ übereinstimmen müssen. Als jemand den Typ einer Eigenschaft in der übergeordneten Schnittstelle änderte, traten in den abgeleiteten Schnittstellen silent-konflikte auf, und die Datenbank entsprach nicht mehr der API.

Geschichte

In der Bibliothek wurden Typ-Aliase mit Überschneidungen von Eigenschaften durch & (Schnittmengen) erstellt, jedoch wurden einige Eigenschaften typisch inkompatibel gemacht. TypeScript hatte dies während der Kompilierung zugelassen, aber tatsächlich traten zur Laufzeit in den Systemen undefinierte Felder auf.

Geschichte

Das Team glaubte, dass eine Schnittstelle nicht durch einen Typ erweitert werden kann, und um die gemeinsame Funktionalität zu erweitern, schrieben sie alle Strukturen von type in interface um, was viel Zeit und Mühe kostete — obwohl man einfach bestehende Typen auf unkonventionelle Weise erweitern konnte.