はじめに

この記事では、TypeScript の Generics の概要について記載します。Generics を利用することで、型の安全性とコードの共通化を両立できます。

開発環境

開発環境は以下の通りです。

以下の例では、関数の引数と戻り値の型を number と定義することで、型の安全性を担保できます。ただ、同じロジックで引数と戻り値の型を string にする必要がある場合、ロジックは同じで型だけが異なる関数を別途定義しなければなりません。

index.ts

function identity(arg: number): number {
  return arg;
}

一方、以下の例では、引数と戻り値の型を any にしているので、number、string どちらの型も利用できます（型ごとに関数を定義する必要はありません）。ただ、コンパイラのチェックが行われなくなり、バグを生みやすくなります（型の安全性が損なわれます）。

index.ts

function identity(arg: any): any {
  return arg;
}

したがって、型の安全性を高めるとコードの共通化が難しくなり、コードを共通化すると型の安全性が損なわれます。

Generics では、型を変数のように扱うことで、型の安全性とコードの共通化を両立します。
以下の例では、関数名の直後に <T>、変数と戻り値の型を T とした関数を定義しています。T が変数にあたります。

index.ts

export function identity<T>(arg: T): T {
  return arg;
}

そして、上記の関数を利用する際、<T> のところで型を指定します。

index.ts

identity<number>(1);
identity<string>("test");

関数の利用時に型を指定しているので、型に合致しない値を引数に渡すと、エラーになります。

extends を使うことで、Generics の型 T を特定の型に限定できます。

以下の例では、T を string と number に限定しています。
限定した型に合致しない型を指定すると、エラーになります。

index.ts

export function identity<T extends string | number>(arg: T): T {
  return arg;
}

identity<boolean>(true);

このように Generics で型を変数のように扱うことで、型の安全性とコードの共通化を両立できます。