Typowe zmienne w TypeScript

Dla lepszego zrozumienia koncepcji generyków stwórzmy naszą pierwszą funkcję - funkcję-tożsamość. Taka funkcja zwraca dokładnie to, co jej przekazano - z tym samym typem.

Na początek napiszmy warianty naszej funkcji osobno.

Napiszmy funkcję, która parametrem przyjmuje liczbę i zwraca liczbę:

typescriptfunction func(data: number): number {
  return data;
}

Teraz napiszmy funkcję, która parametrem przyjmuje string i zwraca string:

typescriptfunction func(data: string): string {
  return data;
}

Załóżmy teraz, że chcemy, żeby wszystko to robiła jedna funkcja. To znaczy chcemy wykonać uogólnienie.

W tym celu użyjemy typowej zmiennej, która przechowuje w sobie typ danych. Taka zmienna deklarowana jest w nawiasach ostrych przed nawiasami okrągłymi z parametrami funkcji. Zadeklarujmy taką zmienną, nadając jej nazwę T (można dowolną):

typescriptfunction func <T>(tutaj parametry) {
  return data;
}

Po tym pojawi się zmienna T, którą można będzie wykorzystać, aby umieścić w niej typ parametru, a następnie wskazać go jako zwracany typ.

Określmy naszemu parametrowi typ w postaci naszej zmiennej:

typescriptfunction func <T>(data: T) {
  return data;
}

Okaże się, że parametr może być przekazany w dowolnym typie, i ten typ zachowa się w naszej zmiennej T.

Teraz wykorzystajmy wartość zmiennej T jako wskazanie wyniku funkcji:

typescriptfunction func <T>(data: T): T {
  return data;
}

Teraz okaże się, że typ wyniku funkcji będzie pobierany z typu parametru. Sprawdźmy.

Wywołajmy funkcję z liczbą:

typescriptconsole.log( func(3) );   // wypisze 3

Wywołajmy funkcję z stringiem:

typescriptconsole.log( func('x') ); // wypisze 'x'