TypeScript Academy · Lektion

Distributive bedingte Typen

Steuern Sie, wie sich Bedingungen über Unions verteilen.

Distributive bedingte Typen ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 4 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.

Eine überraschende Eigenschaft

Bedingte Typen haben eine besondere Regel: Wenn der geprüfte Typ ein nackter Typparameter ist und Sie eine Vereinigung übergeben, wird der bedingte Typ auf jedes Element einzeln verteilt und anschließend werden die Ergebnisse zu einer Vereinigung zusammengefasst.

Das ist die Grundlage von Exclude, Extract und vielen weiteren Hilfstypen.

type ToArray<T> = T extends unknown ? T[] : never;

type A = ToArray<string | number>;
// string[] | number[]  (NOT (string | number)[])

Was „Naked“ bedeutet

„Naked“ bedeutet, dass der Typparameter auf der linken Seite von extends allein steht und nicht in einen anderen Typ eingeschlossen ist. Nur bei nackten Parametern findet eine Verteilung statt.

type Naked<T> = T extends string ? "y" : "n";
// T is naked -> distributes over unions

Verteilung Schritt für Schritt

Für ToArray<string | number> wertet der Compiler jedes Element aus:

ToArray<string> = string[]
ToArray<number> = number[]

Anschließend vereinigt er sie: string[] | number[].

type R = ToArray<boolean>;
// boolean is true | false, so:
// true[] | false[]

Eine Vereinigung filtern

Durch die Verteilung wird das Filtern einfach. Bilden Sie unerwünschte Elemente auf never ab; never verschwindet aus einer Vereinigung, sodass nur die beibehaltenen Elemente übrig bleiben.

type Strings<T> = T extends string ? T : never;

type A = Strings<string | number | boolean>; // string

never verschwindet in Vereinigungen

Eine wichtige Tatsache: X | never vereinfacht sich zu X. Wenn ein verteilter Zweig also never ergibt, wird dieses Element effektiv aus der endgültigen Vereinigung entfernt.

type A = string | never;        // string
type B = "a" | never | "b";     // "a" | "b"

Verteilung deaktivieren

Manchmal möchten Sie die Verteilung nicht, etwa wenn Sie eine ganze Vereinigung als Einheit vergleichen. Umschließen Sie beide Seiten mit einem Tupel aus einem Element: [T] extends [U]. Nun ist T nicht mehr nackt, sodass die Verteilung deaktiviert ist.

type IsNever<T> = [T] extends [never] ? true : false;

type A = IsNever<never>;  // true
type B = IsNever<string>; // false

Warum das Umschließen funktioniert

Indem Sie [T] auf die linke Seite setzen, ist der geprüfte Typ ein Tupel und nicht der unverpackte Parameter. Die besondere Verteilungsregel greift nicht mehr, sodass die Vereinigung als Ganzes geprüft wird.

type AllStrings<T> = [T] extends [string] ? true : false;

type A = AllStrings<"a" | "b">;     // true
type B = AllStrings<"a" | number>;  // false

Verteilt oder nicht verteilt

Vergleichen Sie die beiden Formen direkt. Die nackte Variante prüft jedes Element einzeln, die umschlossene Variante prüft die Vereinigung als einen Typ.

type Distributed<T> = T extends string ? true : false;
type Wrapped<T> = [T] extends [string] ? true : false;

type A = Distributed<string | number>; // boolean (true | false)
type B = Wrapped<string | number>;     // false

Die Implementierung von Exclude

Das integrierte Exclude<T, U> entfernt aus T alle Elemente, die U zugewiesen werden können. Es handelt sich lediglich um einen distributiven bedingten Typ, der passende Elemente auf never abbildet.

type MyExclude<T, U> = T extends U ? never : T;

type A = MyExclude<"a" | "b" | "c", "b">; // "a" | "c"

Die Implementierung von Extract

Extract<T, U> ist das Gegenstück: Behalten werden nur die Elemente, die U zugewiesen werden können. Die Verteilung ist gleich, nur die Zweige sind vertauscht.

type MyExtract<T, U> = T extends U ? T : never;

type A = MyExtract<"a" | "b" | "c", "a" | "c">; // "a" | "c"

Praktische Möglichkeiten

Durch die Verteilung können Sie jedes Element einer Vereinigung in einem einzigen Ausdruck transformieren: Arrays aus jedem Element erstellen, jeder Zeichenkette ein Präfix voranstellen oder nach einer Struktur filtern. Zusammen mit [T] extends [U] für Prüfungen der gesamten Vereinigung können Sie genau steuern, wann die Verteilung stattfindet.

Notation: In echtem TypeScript werden Template-Literal-Typen mit durch Backticks begrenzten Zeichenfolgen geschrieben, die Dollar-geschweifte Platzhalter enthalten. In diesen Ausschnitten stellen wir dieses Muster als Tpl<...> dar und führen jeden Teil in der richtigen Reihenfolge auf; beispielsweise erscheint ein Backtick-Template, das auf das Literalpräfix und anschließend auf Rest passt, als Tpl<'prefix', infer Rest>.

type Prefix<T extends string> = T extends unknown ? Tpl<'id_', T> : never;
// Tpl<'id_', T> is the template literal type joining 'id_' with each T

type A = Prefix<'a' | 'b'>; // 'id_a' | 'id_b'

Schnelltest

Überprüfen Sie Ihr Verständnis distributiver bedingter Typen.

Zusammenfassung

Distributive bedingte Typen sind die Grundlage für Hilfstypen von Vereinigungen.

Ein nacktes T extends U ? wird auf jedes Element einer Vereinigung angewendet.
Zweige, die never zurückgeben, filtern Elemente heraus.
[T] extends [U] deaktiviert die Verteilung für Prüfungen der gesamten Vereinigung.
Exclude und Extract sind kleine distributive bedingte Typen.

Als Nächstes in Kurs 22: Arithmetik im Typsystem.

Häufig gestellte Fragen

Ist die Lektion „Distributive bedingte Typen“ kostenlos?

Ja — der vollständige Text von „Distributive bedingte Typen“ 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 „Distributive bedingte Typen“?

Steuern Sie, wie sich Bedingungen über Unions verteilen. 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 4 von 4.

Wie lange dauert die Lektion „Distributive bedingte Typen“?

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

← Zurück zu TypeScript Academy