TS, Generic


Generic


TS,明示型指定


TSはJSのスーパーセットで、JSにないタイプを明確に指定できます.

エラーの例

function fun(a: string): string {
  return a;
}

fun(123);
// type 'number' is not assignable to type 'string'.
上記のコードに示すように、パラメータaにstringタイプが明示的に指定されている場合、aに123を追加する.すなわち、「numberタイプはstringタイプに割り当てられない」.エラー通知が発生しました.
すなわち、123(number type)はa(string type)に割り当てられない.

エラー解決


では、間違いを解決する方法を理解してみましょう.
function fun(a: string | number): string | number {
  return a;
}

fun(123);
パラメータaにstringまたはnumberのタイプを指定すると、エラーは消えます.

に質問


fun(123)にマウスを置くと

上図のようです.123が付与されている場合はnumberタイプであり、戻りタイプもnumberタイプであるべきであるが、tsはタイプを正しく読み取ることができない.
また、任意のタイプに指定する方法もあります.
function fun(a: any): any {
  return a;
}

fun(123);

しかし、タイプは依然として任意です.
generic typeを適用してタイプを正確に読み出しましょう

Genericの使用

function fun<T>(a: T): T {
  return a;
}

fun<number>(123);
fun(123);
上記のコードに示すようにgenericを設定しfun(123)を使用する場合には2つの方法があります.


上図に示すように、genericを設定すると、タイプが正しく認識されます.

なぜGenericを使うのですか?


関数を1つの用途ではなく複数の用途に使用するには、柔軟にタイプを指定する必要があります.そのとき関数のパラメータはどんなタイプで、returnはどんなタイプなのかを知るために使用されます.