Typy literałowe

Witamy na kolejnej lekcji! W tej lekcji dowiedzą się Państwo więcej o typach literałowych — funkcji TypeScript, która pozwala definiować dokładne, konkretne wartości zmiennych. Dzięki temu kod staje się bardziej przewidywalny i bezpieczny typowo. Zagłębmy się w temat!

Czym są typy literałowe?

Typy literałowe w TypeScript pozwalają zmiennej przechowywać konkretną wartość zamiast ogólnego typu, takiego jak string lub number. Na przykład można ograniczyć zmienną tak, aby przechowywała wyłącznie wartość "yes" albo "no".

Przykład:

Zadanie: Proszę zadeklarować zmienną z typem literałowym i przypisać do niej prawidłowe oraz nieprawidłowe wartości.

let answer: "yes" | "no";
answer = "yes"; 
// Valid
// answer = "maybe"; 
// Error: Type '"maybe"' is not assignable to type '"yes" | "no"'.

Typy literałowe stringów

Typy literałowe stringów ograniczają zmienną do określonego zestawu wartości typu string. Przykład:

Zadanie: Proszę utworzyć typ dla kierunków i przypisać wartości do zmiennej.

type Direction = "up" | "down" | "left" | "right";

let move: Direction;
move = "up"; // Valid
// move = "forward"; 
// Error: Type '"forward"' is not assignable to type '"up" | "down" | "left" | "right"'.

Typy literałowe liczb

Typów literałowych można również używać z liczbami, aby ograniczyć zmienną do określonych wartości liczbowych. Przykład:

Zadanie: Proszę zdefiniować liczbowy typ literałowy dla wyników rzutów kostką i go przetestować.

type DiceRoll = 1 | 2 | 3 | 4 | 5 | 6;

let roll: DiceRoll;
roll = 4; // Valid
// roll = 7; 
// Error: Type '7' is not assignable to type '1 | 2 | 3 | 4 | 5 | 6'.

Typy literałowe w funkcjach

Typów literałowych można używać w parametrach funkcji, aby zezwalać wyłącznie na określone wartości. Przykład:

Zadanie: Proszę napisać funkcję z parametrem, który używa typów literałowych.

function setStatus(status: "active" | "inactive"): void {
  console.log(`The status is now ${status}`);
}

setStatus("active"); 
// Output: The status is now active
// setStatus("pending"); 
// Error: Type '"pending"' is not assignable to type '"active" | "inactive"'.

Typy literałowe i aliasy typów

Aby ponownie używać typów literałowych, można zdefiniować je jako aliasy typów. Przykład:

Zadanie: Proszę utworzyć alias typu dla kolorów sygnalizacji świetlnej i użyć go w zmiennej.

type TrafficLight = "red" | "yellow" | "green";

let light: TrafficLight = "red";
console.log(light);
 // Output: red

Używanie typów literałowych z obiektami

Typów literałowych można używać wewnątrz obiektów, aby ograniczyć wartości określonych właściwości. Przykład:

Zadanie: Proszę utworzyć typ obiektu z właściwością używającą typów literałowych.

type Button = {
  label: string;
  size: "small" | "medium" | "large";
};

let submitButton: Button = {
  label: "Submit",
  size: "medium",
};

console.log(submitButton);

Typowe błędy

Oto niektóre typowe błędy podczas używania typów literałowych:

• Zapominanie o zaktualizowaniu wszystkich dozwolonych wartości podczas modyfikowania typu literałowego.
• Przypisywanie wartości nieuwzględnionych w typie literałowym (TypeScript wykryje ten błąd).
• Używanie typów literałowych dla wysoce dynamicznych danych, gdy elastyczność jest ważniejsza.

Wskazówka: Typów literałowych należy używać w kontrolowanych i przewidywalnych scenariuszach!

Świetna robota!

Gratulacje! Nauczyli się Państwo, jak używać typów literałowych w TypeScript do definiowania precyzyjnych i ograniczonych wartości. Typy literałowe są szczególnie przydatne do tworzenia przewidywalnego i bezpiecznego typowo kodu. W następnej lekcji omówimy obsługę funkcji w TypeScript. Kodujmy dalej!