ジェネリクス

ジェネリクスは抽象的な型引数を使用して、実際に利用されるまで型が確定しない関数などを実現する為に使用されます。

例えば、引数で受け取った文字列型をそのまま返却する関数と、引数で受け取った数値型をそのまま返却する関数があるとします。その場合以下のように内部的な処理は一緒ですが、引数と返却する型が異なる関数を定義する必要があります。

const remainString = (val: string): string => {
  return val
};

const remainNumber = (val: number): number => {
  return val
}

こういった場合に、const remainValue = <T>(val: T): T => {...}と定義することで、使用時にremainValue<string>('a')と型宣言をして呼び出すことで、Tの部分にstringが格納され、(arg: string): stringとなります。ちなみにTの文字は<SAMPLE>(val: SAMPLE): SAMPLEでも動作しますが、慣習的にTとしましょう。

index.ts◎

...
console.log(element.value);

const remainValue = <T>(val: T): T => {
  return val;
};
remainValue<string>('a');
remainValue<number>(2);