programowanieFullstack developer

Jak działa typizacja enum w TypeScript, jakie są rodzaje enum i jaka jest różnica między wartościami stałymi a obliczeniowymi? Jakie pułapki mogą się pojawić przy używaniu enum?

Zdaj rozmowy kwalifikacyjne z asystentem AI Hintsage

Odpowiedź

W TypeScript obsługiwane są dwa rodzaje enum:

  • Numeryczne (numeric) — wartości domyślne są przypisywane w kolejności, zaczynając od 0.
  • Ciągowe (string) — każda wartość musi być przypisana jawnie i jest ciągiem.

Istnieją również heterogeniczne enumy (mieszane typy), ale ich użycie jest zdecydowanie odradzane.

Przykład:

enum Status { Init, Loading, Ready = 5, Error } // Status.Error === 6 enum HttpCode { Ok = 200, NotFound = 404, Internal = 'INTERNAL_ERROR' // Błąd! Tylko ciągi lub tylko liczby } enum Direction { Up = 'UP', Down = 'DOWN', }

Wartości stałe są obliczane w czasie kompilacji. Jeśli wartość ENUM zależy od innych obliczeń lub wyrażeń (na przykład funkcji), staje się to wartością obliczeniową (computed member). Tylko poprzednie człony enum mogą być używane do obliczenia bieżącego członu jako wartości domyślnej.

Ważne cechy:

  • Numeryczne enumy wspierają odwrotne mapowanie enum → liczba → ciąg-nazwa.
  • Ciągowe enumy — tylko bezpośrednie (nazwa → wartość).
  • Błędy kompilacji przy mieszaniu typów w jednym enumie.

Pytanie z zamiarem

Czy można użyć wartości innego enumu przy deklaracji członu nowego enumu?

Odpowiedź: Tak, ale tylko jeśli ta wartość jest stałą lub wcześniej zadeklarowanym członem.

Przykład:

enum A { X = 1 } enum B { Y = A.X } // OK

Jednak nie można używać obliczeń opartych na funkcjach ani danych z innych miejsc (na przykład wywołania funkcji).

Przykłady rzeczywistych błędów z powodu braku znajomości niuansów tematu.


Historia

W projekcie do serializacji danych do zewnętrznego API użyto numerycznego enumu. Przy zmianie kolejności członów enum wartości "wypłynęły", a zewnętrzne systemy zaczęły otrzymywać inne liczby. Spowodowało to błędne stany w zewnętrznych klientach, które były trudne do śledzenia bez audytu kodu.


Historia

W jednym projekcie React błędnie używano zarówno ciągowego, jak i numerycznego enum w switch-case, oczekując, że wartości są konwertowalne na ciągi. Z powodu niezgodności switch nie działał poprawnie, a komponent zwracał nieprawidłowy interfejs użytkownika.


Historia

Przy próbie stworzenia enum, gdzie część wartości jest obliczana za pomocą funkcji, TypeScript nie zgłaszał błędów, ale w niektórych kompilacjach wartości okazywały się undefined. Spowodowało to problemy z routami, gdy enum był używany jako identyfikator dla ścieżek. Krytyczny błąd występował tylko w pakiecie produkcyjnym.