0Pricing
TypeScript Academy · Lektion

Interface-Erweiterung und -Zusammenführung

Erweitern Sie Interfaces und verstehen Sie die Deklarationszusammenführung.

Interface-Erweiterung und -Zusammenführung ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 3 von 4. Du kannst die komplette Lektion unten kostenlos lesen – dann übst du sie direkt im Browser mit einem integrierten Code-Editor und einem KI-Tutor rund um die Uhr. Sie ist Teil des TypeScript Academy-Lernpfads, und dein Fortschritt wird über Web und CoddyKit-App synchronisiert. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Willkommen

Interfaces können andere Interfaces erweitern, um auf vorhandenen Strukturen aufzubauen. Außerdem führt TypeScript mehrere Deklarationen desselben Interfaces automatisch zusammen.

Ein Interface erweitern

Verwenden Sie das Schlüsselwort `extends`, um ein neues Interface zu erstellen, das alle Eigenschaften des übergeordneten Interfaces enthält.
interface Animal { name: string; }
interface Dog extends Animal {
  breed: string;
}
const rex: Dog = { name: 'Rex', breed: 'Labrador' };

Mehrere Interfaces erweitern

Ein Interface kann mehrere Interfaces gleichzeitig erweitern und dabei alle ihre Eigenschaften kombinieren.
interface Flyable { fly(): void; }
interface Swimmable { swim(): void; }
interface Duck extends Flyable, Swimmable {
  quack(): void;
}

Eigenschaften beim Erweitern überschreiben

Ein erweitertes Interface kann eine Eigenschaft des übergeordneten Interfaces überschreiben, der neue Typ muss jedoch dem Typ des übergeordneten Interfaces zuweisbar sein.
interface Base { value: string | number; }
interface Derived extends Base { value: string; } // OK — string is narrower
// interface Bad extends Base { value: boolean; } // Error

Deklarationszusammenführung

Wenn Sie zwei Interfaces mit demselben Namen deklarieren, führt TypeScript sie zu einem einzigen Interface mit allen Eigenschaften zusammen.
interface Window { title: string; }
interface Window { location: Location; }
// Merged: Window has both title and location

Bibliothekstypen erweitern

Die Deklarationszusammenführung wird verwendet, um Drittanbieter-Typen zu erweitern. Fügen Sie beispielsweise Eigenschaften zum Request-Interface von Express hinzu.
// express.d.ts
declare namespace Express {
  interface Request {
    user?: User;
  }
}

Ein Interface erweitert einen Typalias

Ein Interface kann einen Typalias erweitern, solange der Alias ein Objekttyp ist.
type Named = { name: string };
interface User extends Named { email: string; }

Verschachtelte Erweiterungsketten

Erweiterungsketten können sich über mehrere Ebenen erstrecken.
interface A { a: number; }
interface B extends A { b: number; }
interface C extends B { c: number; }
const obj: C = { a: 1, b: 2, c: 3 };

extends vs implements

`extends` wird für die Vererbung von Interface zu Interface oder von Klasse zu Klasse verwendet. `implements` wird verwendet, damit eine Klasse einen Interface-Vertrag erfüllt.
interface Serializable { serialize(): string; }
class Model implements Serializable {
  serialize() { return JSON.stringify(this); }
}

Zusammenführung gilt für alle Verwendungen

Wenn Interfaces zusammengeführt werden, erhalten alle vorhandenen Codeabschnitte, die dieses Interface verwenden, automatisch die neuen Eigenschaften. Deshalb funktioniert die Bibliothekserweiterung.

Zusammenführen vs. Erweitern: Wann Sie welches verwenden

Verwenden Sie `extends`, um ein neues Interface auf Grundlage eines vorhandenen zu erstellen. Verwenden Sie die Zusammenführung (derselbe Name), um ein Interface aus einer separaten Datei zu erweitern, beispielsweise im Rahmen einer Bibliothekserweiterung.

Schnellüberprüfung

Welche TypeScript-Funktion ermöglicht es, Eigenschaften zu einem Interface aus einer Drittanbieterbibliothek hinzuzufügen?

Zusammenfassung

Interfaces erweitern andere Interfaces mit `extends` und kombinieren dabei ihre Strukturen. Die Deklarationszusammenführung kombiniert gleichnamige Interfaces automatisch. Dadurch können Sie Bibliotheken erweitern, ohne den Code von Drittanbietern zu ändern.

Häufig gestellte Fragen

Ist die Lektion „Interface-Erweiterung und -Zusammenführung“ kostenlos?

Ja — der vollständige Text von „Interface-Erweiterung und -Zusammenführung“ ist hier im Web kostenlos zu lesen. Um sie interaktiv zu üben (integrierter Code-Editor und 24/7 KI-Tutor) und den Rest des TypeScript Academy-Kurses freizuschalten, upgrade auf CoddyKit PRO. Der TypeScript Academy-Kurs umfasst insgesamt 4 Lektionen.

Was lerne ich in „Interface-Erweiterung und -Zusammenführung“?

Erweitern Sie Interfaces und verstehen Sie die Deklarationszusammenführung. Du übst TypeScript Academy mit praktischem Code, den du direkt im Browser ausführst, und ein 24/7 KI-Tutor beantwortet deine Fragen während du die Lektion bearbeitest.

Brauche ich Erfahrung, um TypeScript Academy zu starten?

Keine Vorkenntnisse erforderlich. TypeScript Academy auf CoddyKit ist für Anfänger bis fortgeschrittene Lernende strukturiert, sodass du hier starten oder von Anfang an beginnen und in deinem eigenen Tempo voranschreiten kannst. Dies ist Lektion 3 von 4.

Wie lange dauert die Lektion „Interface-Erweiterung und -Zusammenführung“?

Die meisten CoddyKit-Lektionen dauern etwa 5–10 Minuten. Jede ist kompakt und interaktiv, sodass du stetig Fortschritte machst und genau dort weitermachst, wo du aufgehört hast – im Web und in der App.

Kann ich in dieser TypeScript Academy-Lektion Code schreiben und ausführen?

Ja. Jede TypeScript Academy-Lektion enthält einen integrierten Code-Editor, sodass du echten Code direkt in deinem Browser schreibst und ausführst und sofort KI-Feedback erhältst — ohne lokale Einrichtung erforderlich.

Alle Lektionen in diesem Kurs

  1. Objektstrukturen mit Interfaces definieren
  2. Typ-Aliase für komplexe Typen
  3. Interface-Erweiterung und -Zusammenführung
  4. Interface vs. Type: Wann welches verwenden
← Zurück zu TypeScript Academy