Types littéraux

Bienvenue dans la prochaine leçon ! Dans cette leçon, vous découvrirez les types littéraux, une fonctionnalité de TypeScript qui permet de définir des valeurs exactes et précises pour les variables. Votre code devient ainsi plus prévisible et mieux sécurisé par le typage. Plongeons dans le sujet !

Que sont les types littéraux ?

Les types littéraux de TypeScript permettent à une variable de contenir une valeur précise, plutôt qu’un type général comme chaîne ou nombre. Par exemple, vous pouvez limiter une variable à la valeur "yes" ou "no".

Exemple :

Tâche : Déclarez une variable avec un type littéral et affectez-lui des valeurs valides et invalides.

let answer: "yes" | "no";
answer = "yes"; 
// Valid
// answer = "maybe"; 
// Error: Type '"maybe"' is not assignable to type '"yes" | "no"'.

Types littéraux avec des chaînes

Les types littéraux de chaîne limitent une variable à un ensemble précis de valeurs de type chaîne. Exemple :

Tâche : Créez un type pour les directions et affectez des valeurs à une variable.

type Direction = "up" | "down" | "left" | "right";

let move: Direction;
move = "up"; // Valid
// move = "forward"; 
// Error: Type '"forward"' is not assignable to type '"up" | "down" | "left" | "right"'.

Types littéraux avec des nombres

Vous pouvez également utiliser des types littéraux avec des nombres pour limiter une variable à certaines valeurs numériques. Exemple :

Tâche : Définissez un type littéral numérique pour des lancers de dés et testez-le.

type DiceRoll = 1 | 2 | 3 | 4 | 5 | 6;

let roll: DiceRoll;
roll = 4; // Valid
// roll = 7; 
// Error: Type '7' is not assignable to type '1 | 2 | 3 | 4 | 5 | 6'.

Types littéraux dans les fonctions

Vous pouvez utiliser des types littéraux dans les paramètres des fonctions pour n’autoriser que certaines valeurs. Exemple :

Tâche : Écrivez une fonction dont un paramètre utilise des types littéraux.

function setStatus(status: "active" | "inactive"): void {
  console.log(`The status is now ${status}`);
}

setStatus("active"); 
// Output: The status is now active
// setStatus("pending"); 
// Error: Type '"pending"' is not assignable to type '"active" | "inactive"'.

Types littéraux et alias de type

Pour réutiliser des types littéraux, vous pouvez les définir comme des alias de type. Exemple :

Tâche : Créez un alias de type pour les couleurs des feux de circulation et utilisez-le dans une variable.

type TrafficLight = "red" | "yellow" | "green";

let light: TrafficLight = "red";
console.log(light);
 // Output: red

Utiliser les types littéraux avec des objets

Vous pouvez utiliser des types littéraux dans des objets pour limiter les valeurs de certaines propriétés. Exemple :

Tâche : Créez un type d’objet avec une propriété qui utilise des types littéraux.

type Button = {
  label: string;
  size: "small" | "medium" | "large";
};

let submitButton: Button = {
  label: "Submit",
  size: "medium",
};

console.log(submitButton);

Erreurs courantes

Voici quelques erreurs courantes lors de l’utilisation des types littéraux :

• Oublier de mettre à jour toutes les valeurs autorisées lors de la modification d’un type littéral.
• Affecter des valeurs qui ne sont pas incluses dans le type littéral (TypeScript le détectera).
• Utiliser des types littéraux pour des données très dynamiques, lorsque la flexibilité est plus importante.

Conseil : Utilisez les types littéraux dans des situations contrôlées et prévisibles !

Bravo !

Félicitations ! Vous avez appris à utiliser les types littéraux en TypeScript pour définir des valeurs précises et limitées. Les types littéraux sont particulièrement utiles pour créer un code prévisible et mieux sécurisé par le typage. Dans la prochaine leçon, nous explorerons la prise en charge des fonctions par TypeScript. Continuons à coder !