Dalej•LEKCJA 23 / 26

Utility types

Kurs TypeScript · Wyjaśnienie, przykłady, oczekiwany wynik i ćwiczenie.

TypeScript ma wbudowane narzędzia do modyfikowania typów.

Jak to działa?

Partial<T> sprawia, że wszystkie pola są opcjonalne. Pick<T, K> wybiera wskazane pola, a Omit<T, K> usuwa je z opisu typu.

Przykład 1 — poznaj zapis

type User = { id: number; name: string; email: string };
type UserUpdate = Partial<User>;
type UserPublic = Pick<User, "id" | "name">;

const update: UserUpdate = { name: "Anna" };

Nie musisz kopiować wszystkich pól przy definiowaniu wersji częściowej.

Przeczytaj kod linijka po linijce

  1. type User = { id: number; name: string; email: string };Tworzymy lub aktualizujemy zmienną, pole albo przypisanie.
  2. type UserUpdate = Partial<User>;Tworzymy lub aktualizujemy zmienną, pole albo przypisanie.
  3. type UserPublic = Pick<User, "id" | "name">;Tworzymy lub aktualizujemy zmienną, pole albo przypisanie.
Oczekiwany wynik / efektpo uruchomieniu przykładu
Brak tekstu w konsoli. Typ update dopuszcza pomijanie pól.

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.

type User = { id: number; name: string };
const patch: Partial<User> = { name: "Ala" };
console.log(patch.name);
Wynik drugiego przykładupo uruchomieniu przykładu
Ala
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

Zdefiniuj typ bez pola email, korzystając z Omit.

To już koniec tej lekcji.

Jeśli rozumiesz przykład, oznacz lekcję jako ukończoną i przejdź dalej.