32. Jak działa 'Extract' utility type w TypeScript, i kiedy byś go użył?

Jak działa 'Extract' utility type w TypeScript, i kiedy byś go użył?

'Extract' utility type w TypeScript to potężny wbudowany typ, który pozwala wyodrębniać typy z unii, które można przypisać do określonego typu. To narzędzie jest szczególnie przydatne, gdy musisz filtrować typ unii na podstawie określonego kryterium.

Składnia

'TExtract' utility type jest zdefiniowany jako:

Extract<T, U>

Gdzie T to typ unii, z którego chcesz wyodrębnić, a U to typ, który chcesz wyodrębnić.

Przykład

Wyobraź sobie, że masz typ unii różnych liter stringowych i chcesz wyodrębnić tylko niektóre z nich:

type Fruit = 'apple' | 'banana' | 'cherry';

type Citrus = 'lemon' | 'orange';

type ExtractedFruit = Extract<Fruit, 'banana' | 'cherry'>;
// ExtractedFruit to 'banana' | 'cherry'

W tym przykładzie ExtractedFruit będzie zawierać tylko 'banana' i 'cherry' z typu unii Fruit, ponieważ zostały one określone w typie U.

Zastosowania

• Filtrowanie typów: Gdy masz złożony typ unii i potrzebujesz pracować tylko z jego podzbiorem.
• Warunkowe renderowanie: W aplikacji React, gdzie chcesz warunkowo renderować komponenty na podstawie typu danych.
• Obsługa odpowiedzi API: Gdy pracujesz z odpowiedziami API, które mogą zwrócić różne typy, i musisz obsłużyć określone przypadki.

Podsumowanie

'Extract' utility type to wszechstronne narzędzie w TypeScript, które zwiększa bezpieczeństwo typów, pozwalając na precyzyjne wyodrębnienie i użycie części typu unii, które spełniają określone warunki. Może to znacznie uprościć zarządzanie typami i poprawić czytelność oraz bezpieczeństwo kodu.