TypeScript Academy · Lektion

Generische Funktionen: Typparameter

Ergänzen Sie Funktionen um Typparameter, damit sie wiederverwendbar sind.

Generische Funktionen: Typparameter ist eine kostenlose TypeScript Academy-Lektion auf CoddyKit. Dies ist Lektion 1 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

Generics ermöglichen Ihnen, Funktionen zu schreiben, die mit jedem Typ funktionieren und dabei die Typsicherheit bewahren. Statt `any` verwenden Sie einen Typparameter, der beim Aufruf der Funktion bestimmt wird.

Das Problem, das Generics lösen

Eine Funktion, die `any` zurückgibt, verliert Typinformationen. Generics bewahren die Beziehung zwischen Eingabe- und Ausgabetypen.

// Without generics — loses type info
function first(arr: any[]): any { return arr[0]; }

// With generics — type-safe
function first<T>(arr: T[]): T { return arr[0]; }

Syntax von Typparametern

Deklarieren Sie einen Typparameter mit spitzen Klammern `` vor der Parameterliste. Verwenden Sie T in den Parametern und im Rückgabetyp.

function identity<T>(value: T): T {
  return value;
}
const n = identity(42);       // T is number
const s = identity('hello');  // T is string

Typinferenz bei generischen Funktionen

TypeScript leitet das Typargument aus dem tatsächlich übergebenen Argument ab. Sie müssen es nur selten explizit angeben.

function wrap<T>(val: T): T[] { return [val]; }
const nums = wrap(42);    // T inferred as number -> number[]
const strs = wrap('hi');  // T inferred as string -> string[]

Mehrere Typparameter

Funktionen können mehrere Typparameter besitzen.

function pair<A, B>(a: A, b: B): [A, B] {
  return [a, b];
}
const p = pair(1, 'hello'); // [number, string]

Generische Array-Funktionen

Generics sind für Array-Hilfsfunktionen unverzichtbar, die mit jedem Elementtyp funktionieren.

function filterNull<T>(arr: (T | null)[]): T[] {
  return arr.filter((x): x is T => x !== null);
}

Explizite Typargumente

Sie können Typargumente explizit angeben, wenn TypeScript sie nicht ableiten kann.

function create<T>(): T | null { return null; }
const user = create<User>(); // T cannot be inferred — must be explicit

Generics im Vergleich zu any

Im Gegensatz zu `any` bewahren Generics die Beziehung zwischen den Typen innerhalb der gesamten Funktion. Der Rückgabetyp ist mit dem Eingabetyp verknüpft.

function echo<T>(val: T): T { return val; }
const n: number = echo(42);   // OK
// const s: string = echo(42); // Error — T is number

Generische Pfeilfunktionen

Pfeilfunktionen verwenden dieselbe Syntax, benötigen in .tsx-Dateien jedoch ein Komma, um sie von JSX-Tags zu unterscheiden.

const identity = <T>(val: T): T => val;
// In .tsx files:
const identity2 = <T,>(val: T): T => val;

Einen anderen Typ zurückgeben

Generische Funktionen können den Typparameter in transformierten Formen verwenden.

function mapArray<T, U>(arr: T[], fn: (item: T) => U): U[] {
  return arr.map(fn);
}
const lengths = mapArray(['hello', 'world'], s => s.length);
// lengths: number[]

Generische Parameter mit Standardwerten

Geben Sie einen Standardtyp für einen Typparameter an, um ihn optional zu machen.

function createList<T = string>(): T[] { return []; }
const list = createList(); // T defaults to string

Kurztest

Welchen Rückgabetyp hat `identity(42)`?

Zusammenfassung

Generische Funktionen verwenden Typparameter (T), um Typbeziehungen zwischen Ein- und Ausgaben zu bewahren. TypeScript leitet Typargumente automatisch ab. Verwenden Sie Generics statt any, um wiederverwendbare, typsichere Hilfsfunktionen zu schreiben.

Häufig gestellte Fragen

Ist die Lektion „Generische Funktionen: Typparameter“ kostenlos?

Ja — der vollständige Text von „Generische Funktionen: Typparameter“ 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 „Generische Funktionen: Typparameter“?

Ergänzen Sie Funktionen um Typparameter, damit sie wiederverwendbar sind. 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 1 von 4.

Wie lange dauert die Lektion „Generische Funktionen: Typparameter“?

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