Klucz do przejrzystości kodu

przez

Wyliczenia TypeScript to fraza, która będzie często spotykana w przypadku języka TypeScript.

TypeScript jest jednym z najmłodszych, ale jest również uznawany za jeden z najpopularniejszych języków programowania przez programistów. TypeScript jest rozszerzeniem (nadzbiorem) JavaScript. Zatem każdy prawidłowy kod JavaScript jest również prawidłowy w TypeScript. Jednak TypeScript wprowadza możliwości pisania statycznego (brakującą funkcję w JavaScript).

Czym są wyliczenia TypeScript, ich przypadki użycia i jak można je utworzyć? W tym artykule znajdziesz wszystko, co musisz wiedzieć o Enumach.

Co to są wyliczenia TypeScript?

Wyliczenia (typy wyliczeniowe) to struktury danych o stałej długości, które przechowują zbiór niezmiennych wartości (stałych). TypeScript nie jest jedynym językiem korzystającym z wyliczeń, ponieważ są one dostępne w językach obiektowych, takich jak C# i Java.

W TypeScript wyliczenia umożliwiają programistom tworzenie zestawu odrębnych przypadków lub celów dokumentu. Są one również ważne przy ustawianiu wartości lub właściwości, które mogą mieć tylko określoną liczbę wartości. Na przykład na świecie może być tylko siedem kontynentów.

Podsumowując, wyliczenia TypeScript są ważne z następujących powodów:

  • Są elastyczne, ponieważ pozwalają programistom łatwo dokumentować i wyrażać intencje oraz przypadki użycia
  • Wyliczenia umożliwiają programistom tworzenie energooszczędnych stałych niestandardowych w JavaScript
  • Oszczędza czas kompilacji i wykonania podczas kompilowania kodu TypeScript do kodu JavaScript

Wyliczenia TypeScriptu mogą być ciągami lub w formie numerycznej. Jednakże wyliczenia te są wstępnie przetwarzane i nie podlegają testowaniu w fazie testowania. TypeScript tłumaczy/konwertuje wyliczenia na kod JavaScript.

Różne wyliczenia w TypeScript

Teraz, gdy rozumiesz wyliczenia, czas zobaczyć, jak działają w TypeScript. Możesz skonfigurować serwer programistyczny, pobierając TypeScript i Node.js na swój komputer lokalny lub korzystając z rozwiązań online. Będziemy korzystać z Plac zabaw TypeScriptu aby zademonstrować różne wyliczenia TypeScript.

Są to różne typy wyliczeniowe w TypeScript;

#1. Wyliczenia numeryczne

Musisz użyć słowa kluczowego „enum”, a po nim podać nazwę wyliczenia, które chcesz utworzyć. Następnie tworzysz nawiasy curry, które będą określać elementy wyliczenia. To jest przykład wyliczenia numerycznego;

enum CardinalDirections {
  North = 5,
  East,
  South,
  West,
};

Powyższe reprezentuje wyliczenie o nazwie CardinalDirections, które ma cztery elementy. W tym przypadku mogą istnieć tylko cztery wartości (Północ, Wschód, Południe i Zachód), co czyni wyliczenie doskonałym wyborem do przechowywania danych.

Przypisałem CardinalDirections.North wartość 5. Jednak pozostałych wartości nie przypisałem, ponieważ TypeScript zrobi resztę automatycznie. Na przykład wartość CardinalDirections.East będzie wynosić 6, ponieważ TypeScript zwiększa poprzednią wartość o 1.

CardinalDirections.West będzie 8.

Co się stanie, jeśli nie przypiszemy wartości do pierwszego elementu w nawiasach curry? Naszym wyliczeniem będzie;

enum CardinalDirections {
  North,
  East,
  South,
  West,
};

TypeScript automatycznie przypisze wartość North 0. Jeśli wpiszesz coś takiego jak CardinalDirections.West, otrzymasz 3

#2. Wyliczenia ciągów

Każdy element wyliczenia ciągu musi zostać zainicjowany innym elementem wyliczenia ciągu lub literałem ciągu. To jest przykład wyliczenia ciągu;

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

To wyliczenie nie zwiększa się tak, jak ma to miejsce w przypadku wyliczeń numerycznych. Jeśli uruchomisz ten kod; 

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}
console.log(Direction.Right)

To jest to, co otrzymujesz;

„PRAWIDŁOWY”

#3. Wyliczenia heterogeniczne

Możesz mieszać elementy liczbowe i łańcuchowe, aby utworzyć wyliczenie heterogeniczne. To jest przykład; 

enum HeterogeneousEnum {
  No = 0,
  Yes = "YES",
}

#4. Stałe i obliczone elementy wyliczeniowe

Z elementami wyliczeniowymi powiązane są wartości, które mogą być „stałe” lub „obliczone”.

To jest przykład stałego wyliczenia;

enum E1 {
  X,
  Y,
  Z,
}

W tym przypadku pierwszy element wyliczenia nie ma inicjatora i TypeScript przypisuje mu wartość 0.

Możesz także rozważyć ten przykład;

enum E1 {
  X=1,
  Y,
  Z,
}

Jest to również wyliczenie stałe, ponieważ pierwszemu członowi przypisana jest wartość, a do pozostałych stosowana jest reguła przyrostowa.

Obliczone wyliczenia łączą elementy stałe i obliczone. Sprawdź ten przykład;

enum Color {
  Red = 100,
  Green = (Math.random() * 100),
  Blue = 200
}

Członek Enum „Blue” jest stałym członkiem. Z drugiej strony element wyliczeniowy „Green” jest wyliczeniem obliczanym za pomocą funkcji Math.random() w czasie wykonywania.

#5. Wyliczenia stałe

Wyliczenia const służą do zwiększenia wydajności wyliczeń numerycznych. W tym przypadku deklarujemy wyliczenie jako stałą.

Rozważmy ten kod, który pokazuje dni tygodnia;

enum Weekday {
  Monday = 1,
  Tuesday,
  Wednesday,
  Thursday,
  Friday
}

Jeśli uruchomimy console.log(dzień tygodnia.czwartek), otrzymamy odpowiedź 4. Jeśli jednak sprawdzimy JavaScript wygenerowany w czasie kompilacji, otrzymamy to;

"use strict";
var Weekday;
(function (Weekday) {
    Weekday[Weekday["Monday"] = 1] = "Monday";
    Weekday[Weekday["Tuesday"] = 2] = "Tuesday";
    Weekday[Weekday["Wednesday"] = 3] = "Wednesday";
    Weekday[Weekday["Thursday"] = 4] = "Thursday";
    Weekday[Weekday["Friday"] = 5] = "Friday";
})(Weekday || (Weekday = {}));
console.log(Weekday.Thursday);

Możemy zmienić ten kod i zadeklarować „dzień tygodnia” jako stałą;

const enum Weekday {
  Monday = 1,
  Tuesday,
  Wednesday,
  Thursday,
  Friday
}

Jeśli uruchomimy ten kod console.log(Weekday.Thursday), JavaScript, który zostanie wygenerowany w czasie kompilacji, będzie;

"use strict";
console.log(4 /* Weekday.Thursday */);

Możesz zobaczyć, że kod JavaScript w czasie kompilacji jest zoptymalizowany, gdy zadeklarujesz swoje wyliczenie jako stałą.

#6. Wyliczenia otoczenia

Wyliczenia otoczenia używają słowa kluczowego „deklaruj” do opisania kształtu już istniejących typów wyliczeń. Rozważ ten przykład;

declare enum Color {
  Red,
  Green,
  Blue
}

Wyliczenia otoczenia są deklarowane poza dowolnym modułem i mogą być używane do tworzenia typów wielokrotnego użytku. W związku z tym zawsze możesz importować wyliczenia otoczenia i używać ich w swoich komponentach, o ile są one zadeklarowane globalnie.

Teraz rozumiesz różne typy wyliczeń w TypeScript. Możemy teraz pokazać, jak można używać wyliczeń na różne sposoby. To będzie nasz kod referencyjny;

enum Direction {
  North="N",
  East="E",
  South="S",
  West="W",
};

Oto kilka przypadków użycia;

  • Wyodrębnij elementy wyliczeniowe. Na przykład, jeśli chcemy uzyskać dostęp do północy, możemy użyć

konsola.log(Kierunek.Północ); // Dane wyjściowe: „N”

  • Użyj elementów wyliczeniowych: możesz wybrać określony element wyliczeniowy, który będzie reprezentował określony kierunek. Na przykład, 
const currentDirection = Direction.East;
console.log(`The current direction is ${currentDirection}`);

To da temu wyjściu „Obecny kierunek to E”

Wyliczenia a mapy obiektów w TypeScript

Wyliczenia służą do reprezentowania skończonego zestawu wartości. Na przykład kolory tęczy lub dni tygodnia. Wyliczenia są silnie typowane, co oznacza, że ​​wychwytują wszelkie błędy podczas programowania. To jest przykład wyliczenia TypeScript;

enum Color {
  Red,
  Green,
  Blue,
}

Mapy obiektów/słowniki/pary klucz-wartość przechowują i pobierają wartości powiązane z określonymi kluczami. Map obiektów TypeScript można używać do przechowywania dowolnego typu danych. Jednak nie są one ściśle wpisane, co oznacza, że ​​błędy typu mogą nie zostać wychwycone podczas programowania. To jest przykład mapy obiektów o tych samych kolorach;

const colors = {
  red: "FF0000",
  green: "00FF00",
  blue: "0000FF",
};

Główne różnice między wyliczeniami i mapami obiektów w TypeScript to:

  • Wyliczenia są ściśle wpisywane, podczas gdy mapy obiektów nie
  • Wyliczenia są „typem”, podczas gdy mapy obiektów są strukturą danych
  • Wyliczenia nie są elastyczne, podczas gdy mapy obiektów są elastyczne

Najlepsze praktyki używania wyliczeń w TypeScript

Stwierdziliśmy już, że TypeScript nie jest jedynym językiem programowania wyposażonym w funkcję wyliczeń. Przestrzeganie najlepszych praktyk gwarantuje, że napiszesz czysty, zoptymalizowany i wolny od błędów kod. Oto niektóre z najlepszych praktyk podczas pisania/używania wyliczeń TypeScript;

  • Nazwy wyliczeń pisz wielką literą: Zawsze pisz pierwsze słowo podczas nazywania wyliczeń wielką literą. Na przykład zawsze zaleca się użycie wyliczenia „Numer” zamiast „liczba”.
  • Używaj wyliczeń dla stałych: wyliczeń najlepiej używać do deklarowania stałego zestawu powiązanych elementów. Na przykład tydzień może mieć tylko 7 dni. Członkowie wyliczenia nigdy nie powinni zmieniać się podczas wykonywania.
  • Unikaj nadużywania wyliczeń: Być może właśnie poznałeś nową koncepcję i chcesz jej używać niemal wszędzie w swoim projekcie TypeScript. Jednak zawsze używaj wyliczeń TypeScript z umiarem. Wyliczenia TypeScript są dobrym wyborem, jeśli chcesz zachować czytelność kodu.
  • Traktuj wyliczenia jako wyliczenia: możesz używać wyliczeń TypeScript do różnych celów. Jednak najlepszą opcją jest użycie ich do reprezentowania tylko wyliczeń, a nie innych struktur danych.
  • Unikaj automatycznych wyliczeń: TypeScript przypisuje wartości członkom wyliczeń, jeśli nie przypiszesz ich jawnie. Podaj wartości wyliczeniowe i unikaj nieoczekiwanego zachowania podczas wykonywania kodu.
  • Wyliczenia dokumentów: Zawsze dokumentuj lub komentuj swój kod, jeśli chcesz, aby był on dostępny dla ogółu społeczeństwa. Wyjaśnij, co robi każde wyliczenie i dlaczego jest to najlepszy przypadek użycia.

Możesz także poznać najlepsze biblioteki TypeScript i środowisko wykonawcze, aby poznać je jako programista.

Wniosek

Możesz definiować wyliczenia w TypeScript i wyjaśniać różne typy oraz ich przypadki użycia. TypeScript przyda się, gdy chcesz mieć przejrzystość kodu. Są jednak również przypadki, w których należy ich unikać i zamiast tego używać obiektów.

Na przykład nie należy używać wyliczeń w przypadku wartości dynamicznych. Nie można także używać wyliczeń jako zmiennych; Twój program zwróci błędy.

Możesz dowiedzieć się więcej o różnicach między TypeScript i JavaScript, jeśli nadal jesteś zdezorientowany tymi dwoma.