TypeScriptのジェネリクスを徹底解説

2026年 2月 19日

はじめに：TypeScriptでジェネリクスを「使う」理由

ジェネリクス（Generics）とは？

TypeScriptを書いていると、「同じ処理だけど、扱うデータの型だけが違う」ことがよくあります。
たとえば「配列の先頭を返す」「値をそのまま返す」「APIレスポンスを受け取る」など、ロジック自体は共通なのに string 版・number 版・User 版…と別々に作成すると、コードが増えたり修正漏れが起きたりします。
そこで役立つのがジェネリクス（Generics）です。

ジェネリクスで出来ること

ジェネリクスを使うと、“型だけが違う同じ処理”を1つにまとめつつ、型安全を維持できます。

コードの重複を減らせる（同じ処理を何度も作成しない）
any みたいに型情報を捨てずに済む
関数の引数と戻り値の関係を、型として表現できる
API連携などで「渡すデータ」「返ってくるデータ」を安全に扱える

このページではまず、ジェネリクスの基本概念と構文を押さえ、そのあと関数ジェネリクスと制約（extends）へ進みます。

TypeScriptにおけるジェネリクスの基本概念と構文（の意味）

ジェネリクスの基本概念

ジェネリクスは一言でいうと、「型をあとから決められる仕組み」です。
関数や型定義に「型の変数（型パラメータ）」を用意しておき、呼び出すときに型を指定したり、TypeScriptに推論させたりできます。

T って何？

T は慣習的に Type（型）の頭文字として使われる名前です。
もちろん T である必要はなく、TUser や TResponse のように意味のある名前にしてOKです。
最小の例：値をそのまま返す（関数ジェネリクスの超基本）

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

：型引数（型パラメータ）を宣言する
value: T：引数は T 型
: T：戻り値も T 型

つまりこの関数は、渡した値の型を保ったまま返すことができます。
使い方：型を明示して渡す / 推論に任せる
(1) 型を明示する（指定して渡す）

const a = identity<string>("hello"); // a: string

(2) 推論に任せる（引数からTypeScriptが推論）

const b = identity("hello"); // b: string（推論）
const c = identity(123);   // c: number（推論）

初心者のうちは「推論に任せる」でも十分です。
ただし、推論が効かないケースもあるので、そのときに「明示して指定する」が効いてきます（後半で扱います）。

ジェネリクスの利点：型を明示せずに安全な処理を作成できる

ジェネリクスの強みとは？

ジェネリクスの強みは、便利さと安全性を両立できるところです。
ここでは「なぜ any じゃダメなの？」「なぜジェネリクスが必要？」を短い例で比較します。
any を使うと起きる問題（型安全が消える）

function identityAny(value: any) {
 return value;
}

const x = identityAny("hello");
x.toFixed(2); // 実行時に落ちる可能性（stringにはtoFixedがない）

any は「なんでもOK」なので、TypeScriptが間違いに気づけません。
結果として、実行するまでバグが見つからないコードになりがちです。

ジェネリクスなら「型を保ったまま」安全にできる

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

const y = identity("hello");
// y.toFixed(2); // コンパイル時にエラー（stringにはtoFixedがない）

このようにジェネリクスは、
「型をあとから決める」柔軟さと「型はちゃんと守る」堅牢さを同時に実現します。
実務で効く場面（少しだけ先取り）

APIレスポンスの型を TResponse として受け取る
リクエストボディの型を TBody として渡す
共通の通信関数を作成しつつ、画面ごとに型を変える

まとめ

この章では、TypeScriptのジェネリクスについて「なぜ使うのか」「基本の考え方と書き方」「anyとの違い」という土台を整理しました。ジェネリクスは、型だけが違う同じ処理を1つにまとめて作成できる仕組みで、引数に渡した型情報を戻り値まで保ったまま扱えるのが大きな強みです。特に、anyのように型安全を捨ててしまう方法と比べると、ジェネリクスはコンパイル時に誤りを検出できるため、実行時のバグを減らせます。

また、型引数は明示して指定することも、引数から推論させることも可能です。初心者のうちは推論に任せて書ける場面が多いですが、推論がうまく働かないケースでは明示することで意図をはっきり伝えられます。

次の記事へ

TypeScript

Next.js