TypeScript Academy · Lektion

Der typeof-Typoperator

Ermitteln Sie mit typeof den Typ eines Laufzeitwerts.

Der typeof-Typoperator 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.

Typen aus Werten

Der Typoperator typeof leitet einen statischen Typ aus einem Laufzeitwert ab. Damit können Sie einen Wert einmal schreiben und seine Struktur als Typ wiederverwenden, sodass beide stets synchron bleiben.

Zwei verschiedene typeof

Verwechseln Sie sie nicht: Das JavaScript-typeof gibt zur Laufzeit einen String zurück; das TypeScript-typeof steht an einer Typposition und erzeugt einen Typ. Dasselbe Schlüsselwort, aber unterschiedliche Bereiche.

const n = 42
console.log(typeof n) // "number" — JS runtime
type T = typeof n     // number — TS type position

Den Typ einer Variablen erfassen

Setzen Sie typeof in einer Typannotation vor einen Wert, um den von diesem Wert abgeleiteten Typ zu erfassen. Hier wird T zu string.

const greeting = "hello"
type G = typeof greeting // string
const another: G = "world"
console.log(another)

Die Struktur eines Objekts erfassen

Auf ein Const-Objekt angewendet liefert typeof dessen vollständige abgeleitete Struktur – Sie müssen das Interface nicht von Hand schreiben.

const config = { host: "localhost", port: 8080 }
type Config = typeof config // { host: string; port: number }
const c: Config = { host: "127.0.0.1", port: 3000 }
console.log(c)

Die Inferenz erweitert Literale standardmäßig

Ohne zusätzliche Angaben erweitert TypeScript Literale: port: 8080 wird zu number, nicht zum Literal 8080. Das ist oft in Ordnung, aber manchmal soll der exakte Wert erhalten bleiben.

const settings = { mode: "dark" }
type S = typeof settings // { mode: string }
const x: S = { mode: "anything" }
console.log(x)

typeof mit as const

Fügen Sie as const hinzu, um einen Wert auf seinen engsten Liter altyp festzulegen. Nun erfasst typeof exakte Literale und markiert alles als readonly.

const settings = { mode: "dark" } as const
type S = typeof settings // { readonly mode: "dark" }
const x: S = { mode: "dark" }
console.log(x)

Literaltypen aus Arrays

Mit as const ergibt typeof auf einem Array ein readonly-Tupel aus Literaltypen – eine Grundlage zum Ableiten von Unions der Werte.

const roles = ["admin", "editor", "viewer"] as const
type Roles = typeof roles // readonly ["admin", "editor", "viewer"]
console.log(roles[0])

Eine Union von Werten ableiten

Kombinieren Sie typeof mit einem indizierten Zugriff über [number], um ein Array aus Konstanten in einen Union-Typ seiner Werte umzuwandeln.

const roles = ["admin", "editor", "viewer"] as const
type Role = typeof roles[number] // "admin" | "editor" | "viewer"
const r: Role = "editor"
console.log(r)

typeof auf Funktionen

Sie können auch den Typ einer Funktion erfassen. Das ist hilfreich, um Wrapper zu typisieren oder eine Signatur an anderer Stelle wiederzuverwenden.

function add(a: number, b: number) { return a + b }
type AddFn = typeof add // (a: number, b: number) => number
const myAdd: AddFn = (x, y) => x + y
console.log(myAdd(2, 3))

Typen synchron halten

Der große Vorteil: Definieren Sie Konfigurationen oder Konstanten einmal als Werte und leiten Sie anschließend mit typeof die Typen ab. Ändern Sie den Wert, wird der Typ automatisch aktualisiert – ohne Duplikation.

const defaults = { retries: 3, timeout: 1000 }
type Defaults = typeof defaults
function apply(opts: Defaults) { return opts.retries }
console.log(apply(defaults))

Funktioniert nur mit Bezeichnern

Der Typoperator typeof erwartet einen Bezeichner oder einen Eigenschaftenpfad, keinen beliebigen Ausdruck. typeof (a + b) ist nicht erlaubt.

const obj = { user: { name: "Ada" } }
type Name = typeof obj.user.name // string
const n: Name = "Leo"
console.log(n)

Schnelltest

Testen Sie Ihr Verständnis des Typoperators typeof.

Zusammenfassung

Der Typoperator typeof leitet an einer Typposition einen Typ aus einem Wert ab – aus einer Variablen, einem Objekt, einem Array oder einer Funktion. Standardmäßig werden Literale erweitert; mit as const erfassen Sie exakte Literaltypen und machen sie readonly. In Kombination mit indiziertem Zugriff (typeof arr[number]) entstehen Wert- unions. Das Ableiten von Typen aus Werten sorgt für eine einzige Quelle der Wahrheit und vermeidet doppelte Strukturen.

Häufig gestellte Fragen

Ist die Lektion „Der typeof-Typoperator“ kostenlos?

Ja — der vollständige Text von „Der typeof-Typoperator“ 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 „Der typeof-Typoperator“?

Ermitteln Sie mit typeof den Typ eines Laufzeitwerts. 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 „Der typeof-Typoperator“?

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