TypeScript Academy · Lekcja

Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców

Dodaj wspólne pole literałowe do elementów unii, aby zapewnić bezpieczeństwo typów.

Lekcja 3 z 413 kroki

Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 3 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.

Wprowadzenie

Unie dyskryminowane dodają wspólną właściwość literałową do elementów unii. TypeScript używa tego dyskryminantu do zawężania typu w instrukcjach switch i if.

Właściwość dyskryminująca

Dyskryminant to właściwość o unikatowym typie literałowym w każdym elemencie unii. TypeScript zawęża unię na podstawie jej wartości.
type Circle = { kind: 'circle'; radius: number };
type Square = { kind: 'square'; side: number };
type Shape = Circle | Square;

Zawężanie za pomocą sprawdzeń if

Sprawdź dyskryminant w instrukcji if. TypeScript zawęzi typ do pasującego elementu unii.
function area(shape: Shape): number {
  if (shape.kind === 'circle') {
    return Math.PI * shape.radius ** 2;
  }
  return shape.side ** 2; // narrowed to Square
}

Zawężanie za pomocą switch/case

Instrukcje switch doskonale współpracują z uniami dyskryminowanymi. Każda gałąź case zawęża typ do konkretnego elementu unii.
function describe(shape: Shape): string {
  switch (shape.kind) {
    case 'circle': return `Circle r=${shape.radius}`;
    case 'square': return `Square s=${shape.side}`;
  }
}

Kompletność za pomocą never

Dodaj domyślną gałąź, która przypisuje wartość do `never`. Jeśli dodasz nowy element unii i zapomnisz go obsłużyć, TypeScript zgłosi błąd.
function area(shape: Shape): number {
  switch (shape.kind) {
    case 'circle': return Math.PI * shape.radius ** 2;
    case 'square': return shape.side ** 2;
    default:
      const _exhaustive: never = shape;
      throw new Error('Unhandled shape');
  }
}

Wzorzec typu Result

Unie dyskryminowane doskonale nadają się do wzorca Result — pozwalają zwracać dane powodzenia albo błąd bez rzucania wyjątku.
type Ok<T> = { ok: true; value: T };
type Err = { ok: false; error: string };
type Result<T> = Ok<T> | Err;

Wzorzec typu akcji (w stylu Redux)

W Reduxie i podobnych systemach akcje są uniami dyskryminowanymi. Pole `type` pełni funkcję dyskryminantu.
type Action =
  | { type: 'INCREMENT'; amount: number }
  | { type: 'DECREMENT'; amount: number }
  | { type: 'RESET' };

Wiele właściwości dyskryminujących

Dyskryminant nie musi być pojedynczą właściwością — TypeScript może zawężać typ na podstawie dowolnej kombinacji sprawdzeń.
type AdminUser = { role: 'admin'; permissions: string[] };
type RegularUser = { role: 'user'; credits: number };
type User = AdminUser | RegularUser;

Unie niedyskryminowane również można zawężać

Nawet bez dyskryminantu TypeScript zawęża unie za pomocą typeof, instanceof i sprawdzania właściwości.
type StringOrArr = string | string[];
function flatten(val: StringOrArr): string[] {
  return Array.isArray(val) ? val : [val];
}

Unie dyskryminowane a hierarchie klas

Unie dyskryminowane są funkcyjną alternatywą dla dziedziczenia klas podczas modelowania wariantów. Są prostsze, można je serializować i dobrze współpracują z dopasowywaniem wzorców.

Praktyczny przykład: unia odpowiedzi HTTP

Modeluj różne stany odpowiedzi API jako unię dyskryminowaną.
type ApiState<T> =
  | { status: 'loading' }
  | { status: 'success'; data: T }
  | { status: 'error'; message: string };

Szybkie sprawdzenie

Co musi mieć każdy element unii dyskryminowanej, aby TypeScript mógł go poprawnie zawężać?

Podsumowanie

Unie dyskryminowane używają wspólnej właściwości literałowej jako dyskryminantu. Zawężaj je za pomocą switch/case i dodaj sprawdzenie kompletności z użyciem never, aby wykrywać nieobsłużone przypadki. Doskonale nadają się do maszyn stanów, akcji i odpowiedzi API.
Bezpłatny start

Ucz się TypeScript dzięki korepetycjom AI — za darmo

Pisz i uruchamiaj kod w przeglądarce, otrzymuj natychmiastową pomoc od korepetytora AI dostępnego 24/7 i kontynuuj naukę w sieci lub w aplikacji.

Kursy
101
Lekcje
352

Często zadawane pytania

Czy lekcja „Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców” jest bezpłatna?

Tak — pełny tekst „Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców” 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 „Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców”?

Dodaj wspólne pole literałowe do elementów unii, aby zapewnić bezpieczeństwo typów. Ć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 3 z 4.

Ile czasu zajmuje lekcja „Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców”?

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 unii: A lub B
  2. Typy przecięć: A i B
  3. Rozróżniane unie na potrzeby bezpiecznego dopasowywania wzorców
  4. Praktyczne wzorce z uniami i przecięciami
← Powrót do TypeScript Academy