TypeScript - Types Conditionnels

Bonjour, futurs magiciens de TypeScript ! Aujourd'hui, nous allons entreprendre un voyage passionnant à travers le monde des Types Conditionnels. Ne vous inquiétez pas si vous êtes nouveaux dans la programmation - je serai votre guide amical, et nous avancerons pas à pas. À la fin de cette leçon, vous serez étonnés de voir combien vous avez appris !

Types Conditionnels de Base

Commençons par les bases. Les Types Conditionnels en TypeScript sont comme faire des décisions dans votre code. Imaginez que vous êtes dans une pâtisserie et que vous devez choisir entre du chocolat et de la vanille en fonction de savoir si il fait chaud ou non. C'est essentiellement ce que font les Types Conditionnels en TypeScript !

Voici un exemple simple :

type IceCreamChoice = boolean extends true ? "Chocolate" : "Vanilla";

Dans ce code, nous disons : "Si boolean (qui représente vrai ou faux) peut être vrai, alors choisissez Chocolate ; sinon, choisissez Vanilla."

Mais attendez, boolean peut toujours être vrai, non ? Alors, faisons cela plus pratique :

type WeatherChoice<T> = T extends "Hot" ? "Ice Cream" : "Hot Chocolate";

let summerChoice: WeatherChoice<"Hot"> = "Ice Cream";
let winterChoice: WeatherChoice<"Cold"> = "Hot Chocolate";

Ici, nous avons créé un type WeatherChoice qui prend un paramètre de type T. Si T étend (ou correspond) à "Hot", nous choisissons "Ice Cream" ; sinon, nous choisissons "Hot Chocolate".

Types Conditionnels Génériques

Maintenant, passons au niveau supérieur ! Les Types Conditionnels Génériques nous permettent de rendre nos types plus flexibles et réutilisables. Pensez à cela comme créer une machine à glace super flexible qui peut faire différentes saveurs en fonction de ce que vous mettez dedans.

type IsArray<T> = T extends any[] ? true : false;

type CheckString = IsArray<string>;  // false
type CheckNumberArray = IsArray<number[]>;  // true

Dans cet exemple, IsArray est un type générique qui vérifie si le type d'entrée T est un tableau. Si c'est le cas, il renvoie true ; sinon, il renvoie false.

Essayons quelque chose de plus complexe :

type ElementType<T> = T extends (infer U)[] ? U : never;

type StringArrayElement = ElementType<string[]>;  // string
type NumberArrayElement = ElementType<number[]>;  // number
type NotArrayElement = ElementType<number>;  // never

Ici, ElementType extrait le type des éléments dans un tableau. Si T est un tableau, il infère le type d'élément U et le renvoie. Si T n'est pas un tableau, il renvoie never (ce qui signifie "cela ne devrait jamais se produire").

Contraintes sur les Types Conditionnels

Parfois, nous voulons mettre des restrictions sur nos types. C'est comme dire : "Tu ne peux avoir de glace à la crème que si tu as fini tes légumes !" Voyons comment cela fonctionne en TypeScript :

type NumberOperation<T extends number> = T extends 0 ? "Zero" : "Non-zero";

type ZeroCheck = NumberOperation<0>;  // "Zero"
type NonZeroCheck = NumberOperation<5>;  // "Non-zero"
type InvalidCheck = NumberOperation<"5">;  // Error: Type '"5"' does not satisfy the constraint 'number'.

Dans cet exemple, NumberOperation n'accepte que les types qui étendent number. Ensuite, il vérifie si le nombre est 0 ou non.

Inférence dans les Types Conditionnels

Enfin, parlons de l'inférence dans les types conditionnels. C'est comme avoir une machine à glace super intelligente qui peut deviner quelle saveur vous voulez en fonction de votre humeur !

type Flatten<T> = T extends Array<infer U> ? U : T;

type FlattenedNumberArray = Flatten<number[]>;  // number
type FlattenedString = Flatten<string>;  // string

Ici, Flatten vérifie si T est un tableau. Si c'est le cas, il infère le type d'élément U et le renvoie. Sinon, il renvoie T tel quel.

Essayons quelque chose de plus avancé :

type ReturnType<T> = T extends (...args: any[]) => infer R ? R : any;

function greet(name: string): string {
return `Hello, ${name}!`;
}

type GreetReturn = ReturnType<typeof greet>;  // string

Dans cet exemple, ReturnType infère le type de retour d'une fonction. Il vérifie si T est un type de fonction, et si c'est le cas, il infère et renvoie le type de retour R.

Conclusion

Félicitations ! Vous avez刚刚 pris vos premiers pas dans le monde des Types Conditionnels en TypeScript. Souvenez-vous, comme apprendre à faire du vélo, cela peut sembler不稳定 au début, mais avec de la pratique, vous serez bientôt en train de rouler sans problème !

Voici un tableau de référence rapide des méthodes que nous avons couvertes :

Méthode	Description
Types Conditionnels de Base	Faire des décisions de type basées sur des conditions
Types Conditionnels Génériques	Créer des types conditionnels flexibles et réutilisables
Contraintes sur les Types Conditionnels	Mettre des restrictions sur les types d'entrée
Inférence dans les Types Conditionnels	Extraire et inférer des types dans les conditions

Continuez à pratiquer, restez curieux, et avant que vous ne vous en rendiez compte, vous créerez des choses incroyables avec TypeScript. Bon codage, futurs maîtres de TypeScript !

Credits: Image by storyset