0Pricing
TypeScript Academy · Lekcja

Łączenie literałów w unie

Twórz skończone zbiory wartości, łącząc typy literałów w unie

Łączenie literałów w unie to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej TypeScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Unie typów literałowych

Unia typów literałowych opisuje wartość, która musi być dokładnie jedną z kilku znanych opcji. Stanowi podstawę maszyn stanów, wyliczeń i poprawnie typowanych interfejsów API.

type Status = 'idle' | 'loading' | 'success' | 'error';

let state: Status = 'idle';
state = 'loading';
console.log('State:', state);

Przełączanie na podstawie unii literałowej

Instrukcja switch dotycząca unii literałowej jest czytelna, a kompilator wie, że każdy przypadek odpowiada jednej z dozwolonych wartości. Doskonale współgra to ze sprawdzaniem kompletności.

type Status = 'idle' | 'loading' | 'done';

function label(s: Status): string {
  switch (s) {
    case 'idle': return 'Waiting';
    case 'loading': return 'Working';
    case 'done': return 'Finished';
  }
}
console.log(label('loading'));

Obsługa wszystkich przypadków

Obsługa każdego elementu unii nosi nazwę obsługi wyczerpującej. Po uwzględnieniu wszystkich przypadków TypeScript może dowieść, że funkcja zawsze zwraca wynik i nie pominięto żadnej gałęzi.

type Dir = 'left' | 'right';

function step(d: Dir): number {
  if (d === 'left') return -1;
  return 1; // only 'right' remains
}
console.log(step('left'), step('right'));

Sztuczka z never do sprawdzania kompletności

Przypisanie wartości do never w gałęzi domyślnej powoduje błąd kompilacji, jeśli zostanie dodany nowy element unii, ale nie zostanie uwzględniony. To zabezpieczenie kodu, który będzie się rozwijał.

type Shape = 'circle' | 'square';

function area(s: Shape): string {
  switch (s) {
    case 'circle': return 'pi r^2';
    case 'square': return 'a^2';
    default:
      const _exhaustive: never = s;
      return _exhaustive;
  }
}
console.log(area('circle'));

Wyprowadzanie unii z obiektów const

Popularny wzorzec polega na przechowywaniu wartości w obiekcie const i wyprowadzaniu unii z jego wartości za pomocą typeof obj[keyof typeof obj]. Jedno źródło prawdy, dwa wyniki.

const Colors = { Red: 'red', Blue: 'blue' } as const;
type Color = typeof Colors[keyof typeof Colors];
// 'red' | 'blue'
const c: Color = Colors.Blue;
console.log(c);

Wyprowadzanie unii z kluczy

Unię kluczy można również wyprowadzić za pomocą keyof typeof obj. Jest to przydatne, gdy to same klucze są znaczącymi identyfikatorami.

const ICONS = { home: 0, search: 1, profile: 2 } as const;
type IconName = keyof typeof ICONS;
// 'home' | 'search' | 'profile'
const name: IconName = 'search';
console.log(name, ICONS[name]);

Unie rozróżniane ze znacznikami literałowymi

Do każdego wariantu obiektu można dodać literałową właściwość tag, dzięki czemu TypeScript może je rozróżniać. Sprawdzenie znacznika zawęża typ do dokładnego kształtu.

type Action =
  | { type: 'add'; amount: number }
  | { type: 'reset' };

function reduce(a: Action): number {
  if (a.type === 'add') return a.amount;
  return 0;
}
console.log(reduce({ type: 'add', amount: 5 }));

Zawężanie na podstawie dyskryminatora

Po sprawdzeniu literałowego dyskryminatora kompilator wie, który wariant jest używany, więc jego unikatowe pola są bezpiecznie dostępne bez rzutowania.

type Event =
  | { kind: 'click'; x: number; y: number }
  | { kind: 'key'; code: string };

function handle(e: Event): string {
  if (e.kind === 'key') return 'Key ' + e.code;
  return 'Click ' + e.x + ',' + e.y;
}
console.log(handle({ kind: 'key', code: 'Esc' }));

Łączenie wielu unii

Większe unie można tworzyć z mniejszych, nazwanych unii. Dzięki temu powiązane opcje są pogrupowane i można ich ponownie używać w całej bazie kodu.

type Primary = 'red' | 'blue' | 'yellow';
type Secondary = 'green' | 'orange';
type Color = Primary | Secondary;

const c: Color = 'green';
console.log(c);

Unie jako ograniczenia funkcji

Przekazanie do funkcji argumentu o typie unii literałowej ogranicza wywołujących do prawidłowych opcji i zapewnia autouzupełnianie w edytorze. Połączenie bezpieczeństwa i łatwego wyszukiwania właściwych opcji trudno pobić.

type Align = 'left' | 'center' | 'right';

function setAlign(a: Align): void {
  console.log('Aligned', a);
}
setAlign('center');
// setAlign('top'); // Error

Dlaczego unie literałowe są lepsze od stringów

Parametr typu string akceptuje dowolną wartość, w tym literówki. Unia literałowa wykrywa błędy podczas kompilacji i dokumentuje prawidłowe opcje — to wyraźny krok w stronę łatwiejszego utrzymania kodu.

type Method = 'GET' | 'POST' | 'PUT' | 'DELETE';

function request(m: Method, url: string): void {
  console.log(m, url);
}
request('POST', '/api/users');

Szybkie sprawdzenie

Sprawdź swoją wiedzę na temat unii literałowych.

Podsumowanie: łączenie literałów

Nauczyli się Państwo:

  • Tworzyć unie literałowe dla skończonych zbiorów opcji.
  • Obsługiwać je wyczerpująco, korzystając dla bezpieczeństwa ze sztuczki z never.
  • Wyprowadzać unie z obiektów const za pomocą keyof typeof i typeof obj[keyof typeof obj].
  • Rozróżniać warianty za pomocą literałowych właściwości znaczników.

Następny kurs: specjalne typy unknown, never i void.

const ROUTES = { home: '/', about: '/about' } as const;
type Route = typeof ROUTES[keyof typeof ROUTES];
const r: Route = '/about';
console.log(r);

Często zadawane pytania

Czy lekcja „Łączenie literałów w unie” jest bezpłatna?

Tak — pełny tekst „Łączenie literałów w unie” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu TypeScript Academy, przejdź na CoddyKit PRO. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Łączenie literałów w unie”?

Twórz skończone zbiory wartości, łącząc typy literałów w unie Ćwiczysz TypeScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć TypeScript Academy?

Nie wymagamy żadnego doświadczenia. TypeScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.

Ile czasu zajmuje lekcja „Łączenie literałów w unie”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji TypeScript Academy?

Tak. Każda lekcja TypeScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Typy literałów stringów i liczb
  2. Literały boolean i wnioskowanie typów literałów
  3. Asercje const z użyciem as const
  4. Łączenie literałów w unie
← Powrót do TypeScript Academy