Výčty v TypeScriptu: Podrobný průvodce
S termínem „výčty“ (enums) se při programování v jazyce TypeScript setkáte velmi často.
TypeScript se řadí mezi mladší, avšak mezi vývojáři velmi oblíbené programovací jazyky. Jde o rozšíření (nadmnožinu) JavaScriptu. To znamená, že jakýkoliv platný kód v JavaScriptu je platný i v TypeScriptu. Navíc TypeScript přináší možnosti statického typování, což v JavaScriptu chybí.
Co přesně jsou výčty v TypeScriptu, jaké mají využití a jak je můžeme vytvořit? Tento článek se zaměří na vše podstatné, co byste o výčtech měli vědět.
Co jsou to výčty v TypeScriptu?
Výčty jsou datové struktury s pevnou délkou, které obsahují sadu neměnných hodnot (konstant). TypeScript není jediný jazyk, který výčty používá – setkáme se s nimi také v objektově orientovaných jazycích, jako je C# nebo Java.
V TypeScriptu výčty umožňují vývojářům definovat sadu specifických stavů nebo záměrů. Jsou klíčové při nastavování hodnot nebo vlastností, které mohou nabývat pouze z omezeného počtu variant. Jako příklad si můžeme uvést sedm kontinentů na Zemi.
Zkrátka, výčty v TypeScriptu jsou důležité z následujících důvodů:
- Jsou flexibilní a umožňují vývojářům snadno dokumentovat a vyjadřovat záměry a různé případy použití.
- Umožňují efektivně vytvářet vlastní konstanty v JavaScriptu.
- Zajišťují optimalizaci při kompilaci kódu TypeScript do JavaScriptu.
Výčty v TypeScriptu mohou nabývat číselných nebo řetězcových hodnot. Tyto výčty jsou zpracovávány v preprocesoru a při testování se netestují. TypeScript převádí výčty do JavaScriptového kódu.
Různé typy výčtů v TypeScriptu
Nyní, když rozumíte podstatě výčtů, můžeme se podívat na jejich implementaci v TypeScriptu. Můžete si vytvořit vývojové prostředí lokálně s TypeScriptem a Node.js, nebo využít online platformy. My si ukážeme použití různých výčtů TypeScript na TypeScript playground.
V TypeScriptu existují tyto typy výčtů:
#1. Číselné výčty
Pro vytvoření výčtu musíte použít klíčové slovo enum
, za kterým následuje název výčtu. Členové výčtu jsou definováni uvnitř složených závorek. Zde je příklad číselného výčtu:
enum CardinalDirections {
North = 5,
East,
South,
West,
};
Výše uvedený kód definuje výčet s názvem CardinalDirections
, který má čtyři členy. V tomto případě existují pouze čtyři možné hodnoty (sever, východ, jih a západ), takže výčet je ideální pro uložení tohoto typu dat.
Členu CardinalDirections.North
jsme přiřadili hodnotu 5. Ostatním členům jsme hodnoty nepřiřadili, protože TypeScript je doplní automaticky. Například hodnota pro CardinalDirections.East
bude 6, protože TypeScript automaticky zvýší předchozí hodnotu o 1.
CardinalDirections.West
bude mít hodnotu 8.
Co když nepřiřadíme hodnotu prvnímu členu? Náš výčet by vypadal takto:
enum CardinalDirections {
North,
East,
South,
West,
};
TypeScript automaticky přiřadí hodnotu 0 členu North
. Pokud se dotážete na CardinalDirections.West
, získáte hodnotu 3.
#2. Řetězcové výčty
Každý člen v řetězcovém výčtu musí být inicializován jiným členem výčtu nebo řetězcovým literálem. Zde je příklad řetězcového výčtu:
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}
Tento výčet se neinkrementuje automaticky jako číselný. Pokud spustíte tento kód:
enum Direction {
Up = "UP",
Down = "DOWN",
Left = "LEFT",
Right = "RIGHT",
}
console.log(Direction.Right)
Výsledkem bude:
"RIGHT"
#3. Heterogenní výčty
Můžete kombinovat číselné a řetězcové členy a vytvořit heterogenní výčet. Zde je příklad:
enum HeterogeneousEnum {
No = 0,
Yes = "YES",
}
#4. Konstantní a vypočítané členy výčtu
Členové výčtu mají přiřazené hodnoty, které mohou být „konstantní“ nebo „vypočítané“.
Zde je příklad konstantního výčtu:
enum E1 {
X,
Y,
Z,
}
V tomto případě první člen výčtu nemá inicializátor a TypeScript mu automaticky přiřadí hodnotu 0.
Můžete zvážit i tento příklad:
enum E1 {
X=1,
Y,
Z,
}
I toto je konstantní výčet, protože první člen má přiřazenou hodnotu, a pro zbývající členy platí inkrementální pravidlo.
Vypočítané výčty kombinují konstantní a vypočítané členy. Podívejte se na tento příklad:
enum Color {
Red = 100,
Green = (Math.random() * 100),
Blue = 200
}
Člen výčtu Blue
je konstantní člen. Na druhou stranu, člen Green
je vypočítaný člen, který používá funkci Math.random()
za běhu.
#5. Const výčty
const
výčty se používají pro zvýšení výkonu číselných výčtů. V tomto případě deklarujeme výčet jako const
.
Zvažte tento kód, který reprezentuje dny v týdnu:
enum Weekday {
Monday = 1,
Tuesday,
Wednesday,
Thursday,
Friday
}
Pokud spustíme console.log(Weekday.Thursday)
, získáme jako odpověď 4. Pokud se ale podíváme na JavaScript, který se vygeneroval během kompilace, získáme toto:
"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);
Můžeme změnit tento kód a deklarovat Weekday
jako konstantu:
const enum Weekday {
Monday = 1,
Tuesday,
Wednesday,
Thursday,
Friday
}
Pokud spustíme tento kód console.log(Weekday.Thursday)
, vygenerovaný JavaScript v době kompilace bude vypadat takto:
"use strict";
console.log(4 /* Weekday.Thursday */);
Můžete si všimnout, že JavaScript kód vygenerovaný v době kompilace je optimalizován, pokud deklarujete výčet jako const
.
#6. Ambient výčty
Ambient výčty používají klíčové slovo declare
pro popis tvaru již existujících typů výčtů. Zvažte tento příklad:
declare enum Color {
Red,
Green,
Blue
}
Ambient výčty se deklarují mimo jakýkoli modul a mohou se používat pro vytváření znovu použitelných typů. Můžete je importovat a používat ve svých komponentách, pokud jsou deklarované globálně.
Nyní už znáte různé typy výčtů v TypeScriptu. Nyní si můžeme ukázat, jak je můžete používat různými způsoby. Použijeme tento referenční kód:
enum Direction {
North="N",
East="E",
South="S",
West="W",
};
Zde je několik příkladů použití:
- Získání členů výčtu. Například, pokud chceme získat přístup k severu, můžeme použít:
console.log(Direction.North); // Výstup: 'N'
- Použití členů výčtu: Můžete vybrat konkrétní člen výčtu, který bude reprezentovat určitý směr. Například:
const currentDirection = Direction.East;
console.log(`The current direction is ${currentDirection}`);
Výstupem bude „The current direction is E“.
Výčty vs. Mapy objektů v TypeScriptu
Výčty se používají pro reprezentaci konečné sady hodnot. Například barvy duhy nebo dny v týdnu. Výčty jsou silně typované, což znamená, že zachycují chyby již během vývoje. Zde je příklad výčtu v TypeScriptu:
enum Color {
Red,
Green,
Blue,
}
Mapy objektů (slovníky, páry klíč-hodnota) slouží k ukládání a načítání hodnot spojených s konkrétními klíči. Mapy objektů v TypeScriptu můžete použít pro uložení libovolného typu dat. Nicméně nejsou striktně typované, takže chyby typu nemusí být zachyceny během vývoje. Zde je příklad mapy objektů s barvami:
const colors = {
red: "FF0000",
green: "00FF00",
blue: "0000FF",
};
Hlavní rozdíly mezi výčty a mapami objektů v TypeScriptu jsou:
- Výčty jsou striktně typované, zatímco mapy objektů ne.
- Výčty jsou „typ“, zatímco mapy objektů jsou datová struktura.
- Výčty nejsou tak flexibilní jako mapy objektů.
Doporučení pro používání výčtů v TypeScriptu
Už jsme zmínili, že TypeScript není jediným programovacím jazykem s funkcí výčtů. Dodržování osvědčených postupů zajišťuje, že budete psát čistý a optimalizovaný kód bez chyb. Zde jsou některé z nejlepších postupů pro psaní a používání výčtů v TypeScriptu:
- Používejte velká písmena v názvech výčtů: Při pojmenovávání výčtů vždy pište první písmeno velkým písmenem. Například je lepší použít výčet
Number
nežnumber
. - Používejte výčty pro konstanty: Výčty se nejlépe používají pro deklarování pevné sady souvisejících položek. Například týden může mít jen 7 dní. Členové výčtu by se během provádění neměli nikdy měnit.
- Vyhněte se nadměrnému používání výčtů: Pokud jste se právě naučili nový koncept, můžete mít tendenci ho používat téměř všude ve vašem TypeScript projektu. Výčty v TypeScriptu používejte s rozvahou. Výčty jsou dobrou volbou, pokud chcete zachovat čitelnost kódu.
- Berte výčty jako výčty: Výčty TypeScript můžete použít pro různé účely. Nejlepším řešením je ale používat je pouze k reprezentaci výčtů a ne jiných datových struktur.
- Vyhněte se automatickým výčtům: TypeScript přiřazuje hodnoty členům výčtu automaticky, pokud je explicitně nezadáte. Zadávejte hodnoty výčtů, abyste se vyhnuli nečekanému chování při spuštění kódu.
- Dokumentujte výčty: Vždy dokumentujte a komentujte svůj kód, pokud jej hodláte používat širší veřejnost. Vysvětlete, co každý výčet dělá a proč je nejlepší možností jeho použití.
Můžete si také prozkoumat nejlepší knihovny a runtime pro TypeScript, abyste se s nimi lépe seznámili.
Závěr
V TypeScriptu můžete definovat výčty a popsat jejich různé typy a způsoby použití. TypeScript se vám bude hodit, když budete chtít mít kód přehledný. Nicméně existují i případy, kdy byste se jim měli vyhnout a místo nich použít jiné datové struktury.
Například byste neměli používat výčty, pokud pracujete s dynamickými hodnotami. Výčty také nemůžete použít jako proměnné – váš program by v tomto případě hlásil chyby.
Pokud stále nemáte jasno v rozdílech mezi TypeScriptem a JavaScriptem, můžete si přečíst více o porovnání těchto dvou jazyků.