ProgrammationDéveloppeur Fullstack

Comment fonctionne la typisation des enum en TypeScript, quels types d'enum existent et quelle est la différence entre les valeurs constantes et les valeurs calculées ? Quels pièges peuvent survenir lors de l'utilisation des enum ?

Réussissez les entretiens avec l'assistant IA Hintsage

Réponse

En TypeScript, il y a deux types d'enum pris en charge :

  • Numériques (numeric) — les valeurs par défaut sont attribuées par ordre, en commençant par 0.
  • Chaînes (string) — chaque valeur doit être définie explicitement et il s'agit d'une chaîne.

Il existe également des enums hétérogènes (types mixtes), mais leur utilisation est fortement déconseillée.

Exemple :

enum Status { Init, Loading, Ready = 5, Error } // Status.Error === 6 enum HttpCode { Ok = 200, NotFound = 404, Internal = 'INTERNAL_ERROR' // Erreur ! Seulement des chaînes ou seulement des nombres } enum Direction { Up = 'UP', Down = 'DOWN', }

Les valeurs constantes sont calculées au moment de la compilation. Si la valeur de l'ENUM dépend d'autres calculs ou expressions (par exemple, une fonction), cela devient une valeur calculée (computed member). Seules les membres précédents de l'enum peuvent être utilisés pour calculer le membre actuel comme valeur par défaut.

Caractéristiques importantes :

  • Les enums numériques prennent en charge la rétroaction enum → nombre → nom-chaîne.
  • Les enums de chaînes — seulement la direction directe (nom → valeur).
  • Erreurs de compilation lors du mélange des types dans un même enum.

Question piège

Peut-on utiliser la valeur d'un autre enum lors de la déclaration d'un membre d'un nouvel enum ?

Réponse : Oui, mais seulement si cette valeur est une constante ou un membre déclaré précédemment.

Exemple :

enum A { X = 1 } enum B { Y = A.X } // D'accord

Cependant, il est impossible d'utiliser des calculs basés sur des fonctions ou des données provenant d'autres emplacements (par exemple, des appels de fonction).

Exemples d'erreurs réelles dues à une méconnaissance des subtilités du sujet.


Histoire

Dans un projet pour la sérialisation de données vers une API externe, un enum numérique a été utilisé. Lors du changement de l'ordre des membres de l'enum, les valeurs ont "flotté", et les systèmes externes ont commencé à recevoir d'autres nombres. Cela a entraîné des états incorrects chez les clients externes, qui étaient impossibles à tracer sans un audit du code.


Histoire

Dans un projet React, un enum de chaîne et un enum numérique ont été utilisés par erreur dans switch-case, en s'attendant à ce que les valeurs soient convertibles en chaînes. En raison de l'incohérence, le switch ne fonctionnait pas correctement, et le composant a renvoyé une interface utilisateur invalide.


Histoire

Lors de la tentative de création d'un enum, où une partie des valeurs est calculée via une fonction, TypeScript n'a pas signalé d'erreur, mais dans plusieurs compilations, les valeurs se retrouvaient undefined. Cela a conduit à des problèmes de routage lorsque l'enum était utilisé comme identifiant pour les chemins. Une erreur critique ne se produisait que dans le bundle de production.