# TypeScript enums: définir des valeurs constantes pour les variables Les TypeScript enums sont une classe spéciale qui se compose de variables constantes. Vous pouvez définir la valeur de ces variables à l’avance. On distingue les enums numériques et les enums basés sur des strings. ## Les TypeScript enums, c’est quoi au juste ? Les enums (abréviation de « *enumerated types* », c’est-à-dire « types énumérés ») sont des types de données qui ont un **ensemble de valeurs constantes**. Cet ensemble de valeurs est déjà clairement défini lors de la déclaration d’un enum avec un identificateur et ne peut pas être modifié par la suite. L’ordre dans lequel les valeurs peuvent apparaître peut aussi être défini à l’avance. Les [TypeScript](https://www.ionos.fr/digitalguide/sites-internet/developpement-web/typescript/) enums permettent de créer des variables constantes qui **augmentent la lisibilité de votre code** tout en **évitant les erreurs**. Les enums TypeScript ne sont pas uniquement une extension typée de JavaScript, mais sont transpilés en objets JavaScript standards, ce qui les rend utilisables directement dans le code JavaScript généré. On distingue les **enums numériques et les TypeScript enums basés sur un string**. Découvrons ensemble les deux variantes. ## TypeScript enums numériques Pour les TypeScript enums numériques, la **première valeur par défaut est « 0 »**. Par la suite, chaque valeur supplémentaire est augmentée de « 1 ». La méthode est initiée avec le paramètre `enum` et stocke les strings en format numérique. Dans l’exemple simple ci-dessous, nous définissons les mois et, dans un premier temps, nous leur attribuons une valeur. Ensuite, nous demandons la valeur définie pour le mois d’avril : ```typescript enum Mois { Janvier, Février, Mars, Avril, Mai, Juin, Juillet, Août, Septembre, Octobre, Novembre, Décembre } let MoisActuel = Mois.Avril; console.log(MoisActuel); ``` Le résultat obtenu est le suivant : ```typescript 3 ``` Par défaut, le système démarre l’affectation des valeurs à « 0 ». Janvier reçoit donc la valeur « 0 », février la valeur « 1 », mars la valeur « 2 » et avril la valeur recherchée « 3 ». Comme cela ne correspond pas à la numérotation réelle des mois, nous initialisons les TypeScript enums et leur **attribuons nous-mêmes les valeurs correspondantes**. Pour ce faire, nous devons juste légèrement modifier le code ci-dessus : ```typescript enum Mois { Janvier = 1, Février, Mars, Avril, Mai, Juin, Juillet, Août, Septembre, Octobre, Novembre, Décembre } let MoisActuel = Mois.Avril; console.log(MoisActuel); ``` Désormais le résultat est : ```typescript 4 ``` Il suffit d’attribuer la valeur souhaitée au premier mois. Le système compte alors comme d’habitude une position de plus. ### Attribuer ses propres valeurs numériques Si vous souhaitez éviter le comptage automatique, vous pouvez également **attribuer une valeur numérique propre** à chaque valeur des enums TypeScript. Dans l’exemple suivant, nous avons quatre tomes d’une série de romans et souhaitons définir leur nombre de pages comme valeur fixe. Nous souhaitons ensuite vérifier le nombre de pages du deuxième volume. Le code ressemble à ceci : ```typescript enum NuméroDePage { Tome1 = 491, Tome2 = 406, Tome3 = 360, Tome4 = 301 } let pages = NuméroDePage.Tome2; console.log(pages); ``` Le résultat obtenu est : ```typescript 406 ``` ## TypeScript enums basés sur des strings Les **TypeScript enums basés sur des strings** fonctionnent selon un principe très similaire. Ici, vous n’attribuez pas de valeur numérique aux enums, mais une chaîne de caractères (string). Dans l’exemple suivant, nous attribuons à chaque jour de la semaine une abréviation appropriée selon le format String et la plaçons entre guillemets. Nous récupérons ensuite les valeurs pour « vendredi » et « mardi » à titre de vérification. Le code se présente ainsi : ```typescript enum JoursDeSemaine { Lundi = "lun", Mardi = "mar", Mercredi = "mer", Jeudi = "jeu", Vendredi = "ven", Samedi = "sam", Dimanche = "dim" }; console.log(JoursDeSemaine.Vendredi); console.log(JoursDeSemaine.Mardi); ``` Le résultat correspondant est : ```typescript ven mar ``` ## Combiner des numéros et des strings En théorie, il est aussi tout à fait possible de **combiner des TypeScript enums numériques et des enums basés sur string**. Les applications possibles pour cette option sont plutôt limitées, mais pour être complet, voici un exemple. Nous définissons ici différentes valeurs. La procédure reste néanmoins la même : ```typescript enum JoursDeSemaine { Lundi = "lun", Mardi = 2, Mercredi = 3, Jeudi = "jeu", Vendredi = "ven", Samedi = 6, Dimanche = "di" }; console.log(JoursDeSemaine.Vendredi); console.log(JoursDeSemaine.Mardi); ``` Le résultat obtenu est alors le suivant : ```typescript ven 2 ``` ## Mappage inverse pour les types de données constants La logique du **mappage inverse** (à vrai dire une « affectation inverse ») est la suivante : si on peut accéder à la valeur d’un TypeScript `enum`, on peut aussi, simultanément, accéder à son nom. Pour mieux comprendre ce principe, reprenons notre exemple avec les jours de la semaine : ```typescript enum JoursDeSemaine { Lundi = 1, Mardi, Mercredi, Jeudi, Vendredi, Samedi, Dimanche } console.log(JoursDeSemaine.Vendredi); // 5 console.log(JoursDeSemaine["Vendredi"]); // 5 console.log(JoursDeSemaine[5]); // "Samedi" ``` Dans cet exemple, `JoursDeSemaine.Vendredi` génère la valeur « 5 ». Il en va de même pour `JoursDeSemaine["Vendredi"]`. Cependant, grâce au mappage inverse, `JoursDeSemaine[5]` génère le nom « Samedi ». En voici la démonstration avec cette commande simple : ```typescript enum JoursDeSemaine { Lundi = 1, Mardi, Mercredi, Jeudi, Vendredi, Samedi, Dimanche } console.log(JoursDeSemaine); ``` Le résultat est le suivant : ```typescript { '1': 'Lundi', '2': 'Mardi', '3': 'Mercredi', '4': 'Jeudi', '5': 'Vendredi', '6': 'Samedi', '7': 'Dimanche', Lundi: 1, Mardi: 2, Mercredi: 3, Jeudi: 4, Vendredi: 5, Samedi: 6, Dimanche: 7 } ``` ## Convertir des TypeScript enums en arrays Il est également possible de convertir TypeScript enums en tableaux (ou [TypeScript arrays](https://www.ionos.fr/digitalguide/sites-internet/developpement-web/typescript-arrays/)). Dans notre exemple reprenant les jours de la semaine ; le code se présente alors comme suit : ```typescript enum JoursDeSemaine { Lundi = "lun", Mardi = "mar", Mercredi = "mer", Jeudi = "jeu", Vendredi = "ven", Samedi = "sam", Dimanche = "dim" }; const JoursDeSemaineArray: { label: string; value: string }[] = []; for (const key in JoursDeSemaine) { if (JoursDeSemaine.hasOwnProperty(key)) { JoursDeSemaineArray.push({ label: key, value: JoursDeSemaine[key] }); } } console.log(JoursDeSemaineArray); ``` Nous obtenons le résultat suivant : ```typescript [ { label: 'Lundi', value: 'lun' }, { label: 'Mardi', value: 'mar' }, { label: 'Mercredi', value: 'mer' }, { label: 'Jeudi', value: 'jeu' }, { label: 'Vendredi', value: 'ven' }, { label: 'Samedi', value: 'sam' }, { label: 'Dimanche', value: 'dim' } ] ``` Conseil Déployez votre site Internet statique ou votre application directement via GitHub : avec [Deploy Now](https://www.ionos.fr/hebergement/deploy-now "Deploy Now de IONOS") de IONOS bénéficiez d’une installation rapide, de workflows optimisés et de différents modèles tarifaires. Trouvez la solution qui convient le mieux à votre projet ! This is a markdown version of: [https://www.ionos.fr/digitalguide/sites-internet/developpement-web/typescript-enums/](https://www.ionos.fr/digitalguide/sites-internet/developpement-web/typescript-enums/) for AI/LLM consumption.