0Pricing
TypeScript Academy · Leçon

Types union et littéraux (introduction au rétrécissement de type)

Combinez des types avec les unions, utilisez les types littéraux pour des valeurs exactes et appliquez un rétrécissement de type élémentaire.

Types union et littéraux (introduction au rétrécissement de type) est une leçon TypeScript Academy gratuite sur CoddyKit. Ceci est la leçon 3 sur 3. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage TypeScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours TypeScript Academy comprend 3 leçons au total.

Introduction

Objectif : apprenez à combiner plusieurs types avec union et à restreindre les valeurs avec les types littéraux. Ces outils contribuent à créer des API plus sûres.

Notions de base des unions

Les types d'union utilisent | pour autoriser l'un de plusieurs types. Ici : string ou number.

let value: string | number;
value = "hello";

value = 42;

// value = true; 
// Error, not allowed

Types littéraux

Les types littéraux limitent les valeurs à des options précises. Ils sont courants pour les configurations et les énumérations.

let direction: "left" | "right";
direction = "left";

// direction = "up";
 // Error

Notions de base du rétrécissement

Le rétrécissement vérifie le type à l'exécution (par exemple, typeof) afin d'accéder aux membres en toute sécurité.

function printId(id: string | number) {
  if (typeof id === "string") {
    console.log(id.toUpperCase());
  } else {
    console.log(id.toFixed(2));
  }
}

printId("abc");
printId(123.456);

Unions discriminées

Les unions discriminées associent des balises littérales à des objets. Le rétrécissement selon kind permet à TypeScript de déduire correctement le type.

type Shape =
  | { kind: "circle"; radius: number }
  | { kind: "square"; size: number };

function area(shape: Shape): number {
  if (shape.kind === "circle") {
    return Math.PI * shape.radius ** 2;
  } else {
    return shape.size * shape.size;
  }
}

console.log(area({ kind: "circle", radius: 2 }));
console.log(area({ kind: "square", size: 3 }));

Pourquoi utiliser les unions et les littéraux ?

Pourquoi utiliser les unions et les littéraux ? Ils rendent les états invalides impossibles, guident l'autocomplétion et permettent au compilateur de détecter les erreurs plus tôt.

Vérification des unions

Vérification rapide : qu'est-ce qu'un type d'union ?

Récapitulatif

Récapitulatif : utilisez | pour les unions, les types littéraux pour les valeurs précises et le rétrécissement pour créer des embranchements sûrs. Ces outils rendent TS expressif et sûr.

Questions Fréquemment Posées

La leçon « Types union et littéraux (introduction au rétrécissement de type) » est-elle gratuite ?

Oui — le texte complet de « Types union et littéraux (introduction au rétrécissement de type) » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours TypeScript Academy, passe à CoddyKit PRO. Le cours TypeScript Academy comprend 3 leçons au total.

Qu'est-ce que j'apprendrai dans « Types union et littéraux (introduction au rétrécissement de type) » ?

Combinez des types avec les unions, utilisez les types littéraux pour des valeurs exactes et appliquez un rétrécissement de type élémentaire. Tu pratiques TypeScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer TypeScript Academy ?

Aucune expérience préalable n'est requise. TypeScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 3 sur 3.

Combien de temps prend la leçon « Types union et littéraux (introduction au rétrécissement de type) » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon TypeScript Academy ?

Oui. Chaque leçon TypeScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

  1. Types primitifs et annotations
  2. Inférence de type et any contre unknown
  3. Types union et littéraux (introduction au rétrécissement de type)
← Retour à TypeScript Academy