Menu
Coddy logo textTech
COMMENCER À APPRENDRE
flag Fr iconFrançaisdown icon

Annotations de type d'objet en ligne

Fait partie de la section Introduction à TypeScript du Journey JavaScript de Coddy. Leçon 37 sur 73.

Parfois, vous devez définir la structure d'un objet pour un cas d'utilisation unique et spécifique. Au lieu de créer un alias de type ou une interface réutilisable, TypeScript vous permet de définir la forme de l'objet directement là où vous déclarez la variable. C'est ce qu'on appelle une annotation de type d'objet en ligne.

La syntaxe utilise des accolades pour décrire les propriétés de l'objet et leurs types directement dans la déclaration de la variable :

let user: { name: string; id: number } = {
  name: "Alice",
  id: 123
};

Cette approche est parfaite pour les structures d'objets uniques que vous ne prévoyez pas de réutiliser ailleurs dans votre code.

challenge icon

Défi

Facile

Créez une variable nommée student avec une annotation de type d'objet en ligne qui définit la structure suivante :

  • propriété name de type string
  • propriété studentId de type number
  • propriété isEnrolled de type boolean

Assignez à la variable les valeurs suivantes :

  • name : "Sarah Johnson"
  • studentId : 12345
  • isEnrolled : true

Créez une autre variable nommée course avec une annotation de type d'objet en ligne qui définit la structure suivante :

  • propriété title de type string
  • propriété credits de type number
  • propriété instructor de type string

Assignez à la variable les valeurs suivantes :

  • title : "Introduction to TypeScript"
  • credits : 3
  • instructor : "Dr. Smith"

Affichez les informations suivantes sur des lignes distinctes :

  • Le nom de l'étudiant
  • L'identifiant de l'étudiant
  • Le titre du cours
  • Le nombre de crédits

Essayez vous-même

// TODO: Écrivez votre code ici
// Créer la variable student avec une annotation de type d'objet en ligne
// Créer la variable course avec une annotation de type d'objet en ligne
// Afficher les informations requises
quiz iconTestez-vous

Cette leçon comprend un petit quiz. Commencez la leçon pour y répondre et suivre votre progression.

Toutes les leçons de Introduction à TypeScript

1Premiers pas avec TS

Qu'est-ce que TypeScript ?Pourquoi utiliser TypeScript ?Votre premier code TypeScriptProcessus de compilation et erreursRécapitulatif : Introduction à TS

4Travailler avec les fonctions

Typage des paramètres et valeurs de retourTypage des fonctions fléchéesLe type de retour 'void'Paramètres optionnels avec '?'Valeurs par défaut des paramètresTypage des paramètres RestDéfinir des types de fonctionsRécapitulatif : Créer des fonctions typées

7Projet : Une liste de tâches simple

Projet : Définir la struct TaskFonction pour ajouter une tâcheLeçon de projetFonction pour modifier le statut d'une tâcheLeçon de projetFonction : Lister les tâches par statutLeçon de projetFonction : Afficher le résumé des tâchesLeçon de projetAssembler le toutLeçon de projet

10Projet : Gestion d'inventaire

Projet : Article d'inventaire génériqueFonction : Ajouter des articles à l'inventaireLeçon de projetFonction pour trouver un article par IDLeçon de projetCréer un type d'inventaire spécifiqueLeçon de projetFonction pour obtenir les détails de l'articleLeçon de projet

2Types fondamentaux

Types de base : str, num, booleanLe type 'any' : la porte de sortieLe type 'unknown'Travailler avec 'null' et 'undef'L'inférence de type en actionAnnotations de type explicitesRécapitulatif : Pratique des types fondamentaux

5Types : Alias, Unions & Intersections

Alias de types pour les primitifsTypes d'union ('|')Travailler avec les types d'unionTypes littérauxTypes d'intersection ('&')Combiner des alias de typesRécapitulatif : Combinaisons de types avancées

8Énumérations

Qu'est-ce qu'une énumération numérique ?Utiliser les énumérations numériquesQu'est-ce qu'une énumération de chaînes ?Utiliser les énumérations de chaînesÉnumérations hétérogènesRécapitulatif : Utiliser les énumérations

11Sujets avancés

Assertions de typeType Guards : in & instanceofLe type 'never'Types nullables ('strictNull')Signatures d'index pour les objetsRécapitulatif : Affiner les types

3Structure de données : Tableaux et Tuples

Tableaux typésModificateur 'readonly' pour les tableauxQu'est-ce qu'un tuple ?Déclaration et accès aux tuplesDéstructuration de tuplesTuples readonlyTableaux typés multidimensionnelsSpread operator avec les tableauxRécapitulatif : Tableaux et tuples

6Typage des objets et interfaces

Annotations de type d'objet en ligneAlias de type pour les objetsIntroduction aux interfacesInterfaces vs Alias de typePropriétés optionnelles et ReadonlyÉtendre les interfaces et les typesAjout de méthodes aux interfacesRécapitulatif : Définir la structure des objets

9Les génériques : un premier aperçu

Le problème résolu par les génériquesCréer une fonction d'identité génériqueUtiliser une fonction génériqueTableaux génériquesInterfaces génériquesRécapitulatif : Pratique des fonctions génériques

Entraînez-vous par vous-même : Compilateur JavaScript en ligne