Leçons du module (1/2)
Type Alias vs Interfaces
En TypeScript, nous pouvons définir la structure d'objets complexes de deux manières principales : en utilisant les Interfaces (interface) ou les Alias de Type (type). Les deux servent à décrire la "forme" d'un objet ou d'une structure de données, mais présentent quelques différences fondamentales.
Les Interfaces (interface)
Une interface définit un contrat pour la structure d'un objet. C'est l'outil standard pour décrire la forme d'objets et d'API de manière extensible.
interface Book {
title: string;
pages: number;
author?: string; // Propriété opzionale (può essere omessa)
}
const myBook: Book = {
title: 'Il Signore degli Anelli',
pages: 1200,
};Le point d'interrogation (?) marque une propriété comme optionnelle. L'objet myBook est valide même s'il omet la propriété author.
Les Alias de Type (type)
Un alias de type permet d'associer un nouveau nom à n'importe quel type existant, y compris des types primitifs, des unions, des tuples ou des structures d'objets complètes.
type Point = {
x: number;
y: number;
};
const coordinates: Point = { x: 10, y: 20 };Différences Clés : Extension et Declaration Merging
Bien que interface et type soient interchangeables pour la plupart des cas d'utilisation courants, ils présentent deux différences cruciales :
1. Extensibilité (Héritage)
Les interfaces s'étendent avec le mot-clé extends :
interface User {
username: string;
}
interface Admin extends User {
privileges: string[];
}Les alias de type ne peuvent pas être étendus avec extends, mais ils peuvent être combinés en utilisant l'intersection (&) :
type User = {
username: string;
};
type Admin = User & {
privileges: string[];
};2. Declaration Merging (Fusion des Déclarations)
Plusieurs interfaces portant le même nom dans le même scope sont automatiquement fusionnées par le compilateur :
interface User {
name: string;
}
interface User {
email: string;
}
// Ora User ha sia 'name' che 'email'!Ce comportement n'est pas pris en charge par les alias de type : déclarer deux fois le même type provoquera une erreur de compilation.
À toi de jouer
Exercice 1 : Interface Utilisateur
Définis une interface appelée User décrivant un objet utilisateur. L'interface doit contenir : id en tant que number, username en tant que string, et email en tant que string optionnelle.
Afficher l'indice
Utilise la syntaxe email?: string pour la marquer comme optionnelle.
Solution disponible après 3 tentatives
Exercice 2 : Alias de Type Point2D
Crée un alias de type appelé Point2D représentant un point bidimensionnel avec les coordonnées x et y (deux nombres).
Afficher l'indice
Utilise la syntaxe type Point2D = { x: number; y: number; };
Solution disponible après 3 tentatives
Exercice 3 : Extension d'Interfaces
Définis une interface appelée Product avec id (number) et price (number). Ensuite, définis une interface appelée DiscountedProduct qui étend Product et ajoute une propriété optionnelle appelée discountCode (string).
Afficher l'indice
Utilise extends Product pour hériter des champs, et ajoute discountCode?: string.
Solution disponible après 3 tentatives
Exercice 4 : Configuration Serveur
Définis un alias de type appelé ServerConfig représentant un objet de configuration pour un serveur. Il doit contenir : host (string), port (number), et useHttps en tant que booléen optionnel.
Afficher l'indice
Utilise la syntaxe type ServerConfig = { host: string; port: number; useHttps?: boolean; }.
Solution disponible après 3 tentatives