Menu
Coddy logo textTech

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 erlaubt

Literal-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.

quiz iconTeste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

quiz iconTeste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

quiz iconTeste dich selbst

Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.

challenge icon

Aufgabe

Einfach

Erstellen 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 playerDirection vom Typ Direction und weisen Sie ihr den Wert "up" zu
  • Deklarieren Sie eine Variable namens currentState vom Typ GameState und weisen Sie ihr den Wert "playing" zu
  • Deklarieren Sie eine Variable namens selectedDifficulty vom Typ Difficulty und 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 movePlayer mit playerDirection auf und geben Sie das Ergebnis aus
  • Rufen Sie updateGameState mit currentState auf und geben Sie das Ergebnis aus
  • Geben Sie den Wert von selectedDifficulty aus

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 erlaubt

Kombinieren 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ültig

Dies 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 aus
quiz iconTeste dich selbst

Diese 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