Literal-Typen
Teil des Abschnitts Einführung in TypeScript der JavaScript-Journey von Coddy — Lektion 33 von 73.
Literal-Typen ermöglichen es Ihnen, eine Variable auf exakte, spezifische Werte anstatt auf breite Kategorien zu beschränken. Anstatt jeden beliebigen String zu akzeptieren, können Sie ihn auf nur "left", "right", "up" oder "down" beschränken.
Ein Literal-Typ verwendet den exakten Wert als den Typ selbst.
Sie können Literal-Typen für Strings, Zahlen oder Booleans erstellen:
let direction: "left" = "left"; // Nur "left" ist erlaubt
let count: 42 = 42; // Nur die Zahl 42 ist erlaubt
let isReady: true = true; // Nur true ist erlaubtLiteral-Typen werden in Kombination mit Union-Typen besonders mächtig, da sie eine kontrollierte Menge an erlaubten Werten erstellen. Dies ist ideal für Szenarien wie Richtungsangaben, Statuscodes oder Konfigurationsoptionen:
type Direction = "left" | "right" | "up" | "down";
type Status = "pending" | "approved" | "rejected";
let playerMove: Direction = "up"; // Gültig
let orderStatus: Status = "pending"; // Gültig
// let invalid: Direction = "diagonal"; // Fehler!Dieser Ansatz bietet Ihnen die Flexibilität mehrerer Optionen bei gleichzeitiger Beibehaltung strenger Typsicherheit. TypeScript erkennt Tippfehler und ungültige Werte zur Kompilierzeit, wodurch Ihr Code zuverlässiger wird als bei der Verwendung allgemeiner String-Typen.
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Aufgabe
EinfachErstellen Sie einen Typ-Alias namens Direction für die literalen Typen "left" | "right" | "up" | "down".
Erstellen Sie einen Typ-Alias namens GameState für die literalen Typen "menu" | "playing" | "paused" | "gameover".
Erstellen Sie einen Typ-Alias namens Difficulty für die literalen Typen "easy" | "medium" | "hard".
Deklarieren Sie nun die folgenden Variablen unter Verwendung Ihrer Typ-Aliase:
- Deklarieren Sie eine Variable namens
playerDirectionvom TypDirectionund weisen Sie ihr den Wert"up"zu - Deklarieren Sie eine Variable namens
currentStatevom TypGameStateund weisen Sie ihr den Wert"playing"zu - Deklarieren Sie eine Variable namens
selectedDifficultyvom TypDifficultyund weisen Sie ihr den Wert"medium"zu
Erstellen Sie eine Funktion namens movePlayer, die einen Parameter namens direction vom Typ Direction akzeptiert und einen string zurückgibt. Die Funktion sollte eine Nachricht im Format "Moving [direction]" zurückgeben.
Erstellen Sie eine weitere Funktion namens updateGameState, die einen Parameter namens state vom Typ GameState akzeptiert und einen string zurückgibt. Die Funktion sollte eine Nachricht im Format "Game state: [state]" zurückgeben.
Rufen Sie Ihre Funktionen mit den von Ihnen erstellten Variablen auf und geben Sie die Ergebnisse aus:
- Rufen Sie
movePlayermitplayerDirectionauf und geben Sie das Ergebnis aus - Rufen Sie
updateGameStatemitcurrentStateauf und geben Sie das Ergebnis aus - Geben Sie den Wert von
selectedDifficultyaus
Geben Sie jedes Ergebnis in einer separaten Zeile in der oben angegebenen Reihenfolge aus.
Spickzettel
Literal-Typen beschränken Variablen auf exakte, spezifische Werte anstatt auf breite Kategorien:
let direction: "left" = "left"; // Nur "left" ist erlaubt
let count: 42 = 42; // Nur die Zahl 42 ist erlaubt
let isReady: true = true; // Nur true ist erlaubtKombinieren Sie Literal-Typen mit Union-Typen, um kontrollierte Mengen an erlaubten Werten zu erstellen:
type Direction = "left" | "right" | "up" | "down";
type Status = "pending" | "approved" | "rejected";
let playerMove: Direction = "up"; // Gültig
let orderStatus: Status = "pending"; // GültigDies bietet Typsicherheit, indem Tippfehler und ungültige Werte zur Kompilierzeit abgefangen werden, während die Flexibilität durch mehrere Optionen erhalten bleibt.
Probier es selbst
// TODO: Schreibe deinen Code hier
// Erstelle Typ-Aliase für Direction, GameState und Difficulty
// Deklariere Variablen unter Verwendung deiner Typ-Aliase
// Erstelle die Funktionen movePlayer und updateGameState
// Rufe die Funktionen auf und gib die Ergebnisse ausDiese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Einführung in TypeScript
1Erste Schritte mit TS
Was ist TypeScript?Warum TypeScript verwenden?Dein erster TypeScript-CodeKompilierungsprozess & FehlerZusammenfassung: Einführung in TS4Arbeiten mit Funktionen
Typisierung von Parametern & RückgabewertenTypisierung von Arrow-FunktionenDer Rückgabetyp 'void'Optionale Parameter mit '?'Standard-ParameterwerteTypisierung von Rest-ParameternDefinieren von FunktionstypenZusammenfassung: Typisierte Funktionen erstellen2Basis-Typen
Basis-Typen: str, num, booleanDer 'any'-Typ: Der NotausgangDer 'unknown'-TypArbeiten mit 'null' & 'undef'Typinferenz in der PraxisExplizite Typ-AnnotationenZusammenfassung: Übung zu Basis-Typen5Typen: Aliase, Unions & Intersections
Typ-Aliase für primitive DatentypenUnion-Typen ('|')Arbeiten mit Union-TypenLiteral-TypenIntersection-Typen ('&')Kombinieren von Typ-AliasenZusammenfassung: Fortgeschrittene Typ-Kombinationen3Datenstruktur: Arrays & Tupel
Typisierte Arrays'readonly'-Modifikator für ArraysWas ist ein Tupel?Deklarieren von und Zugriff auf TupelDestrukturierung von TupelnReadonly-TupelMehrdimensionale typisierte ArraysSpread-Operator mit ArraysZusammenfassung: Arrays und Tupel