Unie typów — TypeScript

Unia pozwala przyjąć jedną z kilku określonych postaci wartości.

Jak to działa?

Zapis string | number oznacza, że wartość może być tekstem albo liczbą. Przed użyciem metod charakterystycznych dla typu trzeba go zawęzić.

Przykład 1 — poznaj zapis

function showId(id: string | number): string {
  return `ID: ${id}`;
}

console.log(showId(12));
console.log(showId("A-12"));

Oba wywołania są poprawne.

Przeczytaj kod linijka po linijce

function showId(id: string | number): string {Definiujemy funkcję lub metodę, której można użyć później.
return `ID: ${id}`;Zwracamy wyliczoną wartość do miejsca wywołania funkcji.
console.log(showId(12));Wyświetlamy wartość, aby sprawdzić efekt działania programu.

Oczekiwany wynik / efektpo uruchomieniu przykładu

ID: 12
ID: A-12

Przykład 2 — podobny problem, inne dane

Teraz przyjrzyj się drugiemu przykładowi. Zwróć uwagę na to, co zmieniło się w kodzie, a co w wyniku. Spróbuj przewidzieć rezultat przed przeczytaniem odpowiedzi.

let answer: "yes" | "no" = "yes";
console.log(answer);

Wynik drugiego przykładupo uruchomieniu przykładu

yes

Sprawdź, czy rozumiesz

Wróć do pierwszego przykładu, zmień jedną wartość i spróbuj samodzielnie przewidzieć wynik. Następnie uruchom kod i porównaj rezultat. W ten sposób nauczysz się nie tylko przepisywać instrukcje, ale rozumieć ich działanie.

Spróbuj samodzielnie

Napisz funkcję akceptującą boolean | string.