TypeScript Academy · Lektion

Variadische Funktionen typisieren

Erstellen Sie flexible APIs mit variadischen Tupeltypen.

Variadische Funktionen typisieren 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.

Generische Funktionen mit variadischen Tupeln

Variadische Tupeltypen ermöglichen es Generics, Argumentlisten zu erfassen und zu bearbeiten. Damit lassen sich Hilfsfunktionen erstellen, die Tupel verketten, Parameter weiterleiten und Aufrufsignaturen unter vollständiger Typsicherheit umformen.

Argumente als Tupel erfassen

Ein auf unknown[] beschränktes Generic kann eine vollständige Argumentliste als Tupeltyp T erfassen und dabei den Typ und die Position jedes Parameters bewahren.

function tuple<T extends unknown[]>(...args: T): T {
  return args
}
const t = tuple("a", 1, true) // type [string, number, boolean]
console.log(t)

Ein generisches Tupel per Spread verwenden

Sie können ein erfasstes generisches Tupel per Spread in eine andere Parameterliste einfügen. Dadurch werden Argumente weitergeleitet, während ihre exakten Typen erhalten bleiben.

function wrap<T extends unknown[]>(fn: (...args: T) => void) {
  return (...args: T) => fn(...args)
}
const log = wrap((n: number, s: string) => console.log(n, s))
log(1, "hi")

Zwei Tupel verketten

Variadische Tupeltypen zeigen ihre Stärke beim Kombinieren von Tupeln. Wenn Sie zwei generische Tupel im Rückgabetyp per Spread einfügen, entsteht ihre Verkettung.

function concat<A extends unknown[], B extends unknown[]>(a: A, b: B): [...A, ...B] {
  return [...a, ...b]
}
const r = concat([1, 2], ["a"]) // [number, number, string]
console.log(r)

Warum der Ergebnistyp präzise ist

Da [...A, ...B] die generischen Tupel per Spread einfügt, bewahrt das Ergebnis den Typ und die Reihenfolge jedes Elements – nicht nur ein vergrößertes Union-Array.

function concat<A extends unknown[], B extends unknown[]>(a: A, b: B): [...A, ...B] {
  return [...a, ...b]
}
const r = concat([true], [42])
const flag: boolean = r[0]
const num: number = r[1]
console.log(flag, num)

Ein Argument voranstellen

Mit variadischen Tupeln können Sie Parameterlisten umformen – beispielsweise eine Funktion, die der Signatur eines Callbacks ein führendes Argument hinzufügt.

function withId<T extends unknown[]>(fn: (...args: T) => void) {
  return (id: number, ...rest: T) => {
    console.log("id", id)
    fn(...rest)
  }
}
const f = withId((msg: string) => console.log(msg))
f(7, "hello")

Den Kopftyp extrahieren

Bei einem Tupelparameter können Sie den Typ des ersten Elements und den Rest mithilfe eines benannten Tupels abtrennen und anschließend jeden Teil separat verarbeiten.

function head<H, T extends unknown[]>(...args: [H, ...T]): H {
  return args[0]
}
const h = head("first", 2, 3) // type string
console.log(h)

Utility-Typ Parameters

Der integrierte Typ Parameters<F> extrahiert die Argumentliste einer Funktion als Tupel – und basiert selbst auf variadischen Tupeltypen. Sie können die Parameter einer Signatur an anderer Stelle wiederverwenden.

function greet(name: string, age: number) {}
type GreetArgs = Parameters<typeof greet> // [string, number]
const args: GreetArgs = ["Ada", 36]
console.log(args)

Weiterleiten mit Parameters

Kombinieren Sie Parameters mit einem Rest-Spread, um einen Wrapper zu erstellen, der Argumente mit identischer Typisierung an eine vorhandene Funktion weiterleitet.

function add(a: number, b: number) { return a + b }
function traced(...args: Parameters<typeof add>): number {
  console.log("calling add", args)
  return add(...args)
}
console.log(traced(2, 3))

Eine Curry-ähnliche Signatur erstellen

Variadische Tupel ermöglichen Hilfsfunktionen für partielle Anwendung: Erfassen Sie einige Argumente jetzt und erwarten Sie den Rest später – alles wird typgeprüft.

function partial<A extends unknown[], B extends unknown[], R>(
  fn: (...args: [...A, ...B]) => R,
  ...a: A
) {
  return (...b: B) => fn(...a, ...b)
}
const addThree = (x: number, y: number, z: number) => x + y + z
const add5 = partial(addThree, 5)
console.log(add5(2, 3)) // 10

Möglichkeiten und Vorsicht

Generics mit variadischen Tupeln bieten präzise, wiederverwendbare Werkzeuge zur Gestaltung von Funktionen – für Wrapper, Weiterleitungen und Verkettungen. Sie sind fortgeschritten, daher sollten Sie sie einsetzen, wenn die zusätzliche Typpräzision den Aufwand tatsächlich rechtfertigt.

function pipe2<A extends unknown[], B, C>(
  f: (...a: A) => B,
  g: (b: B) => C
) {
  return (...a: A) => g(f(...a))
}
const fn = pipe2((n: number) => n * 2, (n) => n + 1)
console.log(fn(5)) // 11

Schnelltest

Testen Sie Ihr Verständnis von Generics mit variadischen Tupeln.

Zusammenfassung

Variadische Tupeltypen ermöglichen es Generics, Argumentlisten als Tupel zu erfassen und an Parameter- oder Rückgabepositionen per Spread einzufügen. Das ermöglicht Tupelverkettung ([...A, ...B]), Argumentweiterleitung, das Aufteilen in Kopf und Rest sowie partielle Anwendung – wobei die exakten Elementtypen erhalten bleiben. Integrierte Typen wie Parameters<F> nutzen dieselbe Grundlage. Verwenden Sie diese Werkzeuge, wenn eine präzise Typisierung der Funktionsstruktur die zusätzliche Komplexität rechtfertigt.

Häufig gestellte Fragen

Ist die Lektion „Variadische Funktionen typisieren“ kostenlos?

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

Erstellen Sie flexible APIs mit variadischen Tupeltypen. 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 „Variadische Funktionen typisieren“?

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