Ograniczenia generyków w TypeScript

W jednej z poprzednich lekcji tworzyliśmy funkcję typu generycznego, która miała wyświetlać długość przekazanego do niej parametru. Jednak podczas kompilacji otrzymaliśmy błąd, ponieważ nie wszystkie typy mogą mieć długość:

typescriptfunction myFunc < T > (data: T): T {
  console.log(data.length); // błąd
  return data;
}

W tamtym przypadku naprawiliśmy sytuację, zmieniając typ generyczny na typ tablicy generycznej. Ale w TypeScript istnieje możliwość stworzenia ograniczeń generyków. Aby to zrobić, w nawiasach ostrych, po zmiennej T piszemy słowo kluczowe extends. Po nim w nawiasach klamrowych zapisujemy nową zmienną str typu łańcuchowego. Reszta kodu funkcji pozostanie bez zmian:

typescriptfunction myFunc <T extends {str: string}> (data: T): void {
  console.log(data.str.length);
}

Okazuje się, że typ generyczny dziedziczy typ zmiennej str, określonej w nawiasach klamrowych. Teraz sprawdźmy działanie naszej funkcji i stwórzmy zmienną myStr, odnoszącą się do typu str, i ustawmy jej wartość w nawiasach klamrowych:

typescriptlet myStr: {str: string} = {str: 'abcde'};

Wywołajmy funkcję myFunc, nie zapominając ponownie określić jej typu i przekażmy zmienną myStr jako parametr:

typescriptmyFunc <{str: string}> (myStr);