Hrdina
Vítejte v poslední lekci kurzu TypeScriptu! V ní spojíte všechno, co jste se naučili, a krok za krokem napíšete jeden program: Kiřin inventář a deník úkolů. Hraničářka Kira nosí pár předmětů, některé z nich cestou použije a vede si seznam svých úkolů. Až budete hotovi, program vypíše tohle:
Kira (hranicar), úroveň 3, životy 34/50, zlato 120
Inventář:
- Léčivý lektvar (léčí 20)
- Stříbrný meč (poškození 12)
- Starý klíč (otevírá kryptu)
- Svitek světla (kouzlo: Světlo)
Kira vypije Léčivý lektvar: životy 50/50
Kira si vezme Stříbrný meč
Kira nemá Dračí vejce
Úkoly:
[splněný] Vlci v lese: +50 zlatých
[otevřený] Ztracená koruna
[neúspěšný] Záchrana mlynáře: mlýn vyhořel
[splněný] Skřetí most: +30 zlatých
Splněné: 2, otevřené: 1, neúspěšné: 1
Kira (hranicar), úroveň 3, životy 50/50, zlato 200Program popíše Kiru, vypíše její předměty, dva z nich použije (lektvar ji vyléčí a meč si vezme do ruky), zkusí najít předmět, který nemá, projde její úkoly, spočítá je a odměny přičte k jejímu zlatu. Použijete většinu kurzu: typové anotace, funkce, rozhraní, vlastnosti jen pro čtení i nepovinné, sjednocení literálů, rozlišená sjednocení se switch a s kontrolou úplnosti, find a undefined, generickou funkci s omezením, Record a typ převzatý z jiného typu. Každé cvičení navazuje na to předchozí (editor začíná jeho hotovým kódem) a přidá jeden kousek.
Plán. V editoru jsou čtyři komentáře, které program dělí na části. Nahoře // Typy: typy popisují data, se kterými program pracuje, a kdo program otevře, uvidí je jako první. Pod nimi // Funkce, pak // Data s Kirou (a později s jejími úkoly) a úplně dole // Hlavní program, který funkce používá a vypisuje. Typy by mohly být kdekoli v souboru, protože před spuštěním programu zmizí. Konstanta kira ale musí vzniknout nad hlavním programem, který ji používá, protože program běží shora dolů.
První krok: hrdina. Hrdina má v této hře jedno ze tří povolání. Seznam povolených hodnot je sjednocení literálů z lekce o sjednocených typech. Hrdina je objekt, takže dostane interface, jako v lekci o typech objektů. Třeba příšera a její obtížnost:
type Obtiznost = "lehka" | "stredni" | "tezka";
interface Prisera {
readonly jmeno: string;
obtiznost: Obtiznost;
zivoty: number;
}
function popisPriseru(prisera: Prisera): string {
return `${prisera.jmeno} (${prisera.obtiznost}), životy ${prisera.zivoty}`;
}
const troll: Prisera = { jmeno: "Troll", obtiznost: "tezka", zivoty: 80 };
console.log(popisPriseru(troll));Vypíše:
Troll (tezka), životy 80Obtížnost se vypíše tak, jak je v kódu, bez háčků a čárek: hodnoty literálových typů píšeme jako identifikátory, bez diakritiky. Stejně dopadne i Kiřino povolání, hranicar. Jak to vylepšit, se dozvíte na konci lekce.
Kiřino jméno se během dobrodružství nezmění, a proto bude jen pro čtení, readonly. TypeScript pak ohlásí každý řádek, který by ho chtěl změnit: Cannot assign to 'jmeno' because it is a read-only property. Životy, zlato a úroveň se měnit budou, takže jsou to obyčejné vlastnosti. maxZivoty je nejvíc životů, kolik Kira může mít: lektvar ji později nad tuto hranici nevyléčí.
Konstantu kira anotujte typem Hrdina, aby ji TypeScript porovnal s rozhraním hned tam, kde vzniká. Bez anotace by TypeScript typ odvodil z objektu a její povolani by bylo obyčejný string: vlastnosti objektu se mohou měnit, a proto dostanou širší typ, jak jste viděli u typeof v minulé lekci. Volání popisHrdinu(kira) by pak skončilo chybou, protože ne každý text je Povolani.
Funkce popisHrdinu vrátí jeden řádek textu o hrdinovi a hlavní program ho vypíše. Text složte pomocí šablonového řetězce, jako v popisPriseru. Na konci lekce vypíšete stejný řádek ještě jednou, po Kiřině dobrodružství, takže se funkce vyplatí.
Jak psát:
Pokyny
Pod // Typy napište typ Povolani: sjednocení literálových typů "valecnik", "mag" a "hranicar".
Pod něj napište interface Hrdina s vlastností jmeno (text) jen pro čtení, s vlastností povolani typu Povolani a s čísly uroven, zivoty, maxZivoty a zlato.
Pod // Data vytvořte konstantu kira typu Hrdina: Kiru, hraničářku úrovně 3, s 34 z 50 životů a se 120 zlatými.
Pod // Funkce napište funkci popisHrdinu(hrdina: Hrdina): string a pod // Hlavní program vypište, co vrátí pro Kiru:
Kira (hranicar), úroveň 3, životy 34/50, zlato 120Začněte programovat zdarma
1/7