TypeScriptの「再帰型」をマスターする——階層構造を型で縛り上げる技術
こんにちは。TypeScriptの深淵を覗く旅へようこそ。
普段、関数に引数を渡すとき、私たちは「数値」や「文字列」といった平坦な型を定義することに慣れています。しかし、現実のアプリケーション開発では、フォルダ構造やメニューの階層、あるいはJSONのように「自分の内部に自分と同じ構造を持つ」データ、いわゆる再帰的な構造を扱う場面が必ずやってきます。
今日は、TypeScriptの型システムの中でも、特に美しく、かつ恐ろしい「Recursive Types（再帰型）」について、その本質を紐解いていきましょう。ここを突破すれば、あなたの型定義の解像度は一気に一段階引き上がりますよ。
—
1. なぜ「再帰型」が必要なのか？
例えば、シンプルな「カテゴリツリー」を考えてみましょう。あるカテゴリには「名前」があり、その下に「サブカテゴリ」が複数ぶら下がっている構造です。
type Category = {
name: string;
subCategories: Category[]; // ここに注目！
};
この `Category[]` の部分こそが再帰型の正体です。「`Category` を定義するために `Category` を参照している」という自己言及的な構造ですね。TypeScriptのコンパイラは、この定義を見ると「なるほど、無限に深掘りできるツリー構造なんだな」と理解します。
2. 再帰型を関数で扱う際の「推論の限界」
では、このツリー構造を深さ優先探索（DFS）で処理する関数を作ってみましょう。
function printCategories(node: Category, depth: number = 0): void {
console.log(” “.repeat(depth) + `- ${node.name}`);
// 再帰的に呼び出す
node.subCategories.forEach(sub => printCategories(sub, depth + 1));
}
// 実行例
const root: Category = {
name: “Root”,
subCategories: [
{ name: “Child A”, subCategories: [] },
{ name: “Child B”, subCategories: [{ name: “Grandchild B1”, subCategories: [] }] }
]
};
printCategories(root);
これは非常に綺麗に動きますよね。しかし、ここからが「型システムの限界」の話です。もし、この構造が「JSONのように不特定多数のデータ」だとしたらどうでしょう？
陥りやすい罠：無限再帰の型定義
型定義自体を「複雑な計算」に使いすぎると、TypeScriptのコンパイラは「この型、いつ終わるんだ…？」とパニックを起こし、`Type instantiation is excessively deep and possibly infinite.`（型の評価が深すぎて終わらないよ！）というエラーを吐き出します。
これは、コンパイラが型を解決する際、ある一定の再帰回数制限を超えると、安全のために処理を打ち切ってしまうからです。
—
3. 再帰の限界を突破する「型定義の工夫」
もし、巨大なデータ構造や、深さが予測できない動的なJSONを型付けする必要がある場合、単に `Category` を定義するだけでは太刀打ちできないことがあります。そんな時、プロの現場では「再帰の深さを制限する」というテクニックを使います。
テクニック：Conditional Typesによる再帰制限
再帰に「上限回数」を設けることで、コンパイラの負荷を抑えつつ、柔軟な型を定義できます。
// 再帰の深さを3段階までに制限する型定義
type RecursiveLimit
Depth extends 0 ? any : { [K in keyof T]: T[K] | RecursiveLimit
// ※ Prev型は数値のデクリメントを行うヘルパー型（中級者向けテクニックです）
このように「型をただ定義する」のではなく、「型を計算させる」という視点を持つと、TypeScriptは単なるチェックツールから、強力なコンパイル時メタプログラミング環境へと姿を変えます。
—
4. まとめ：型を「制約」ではなく「設計図」として捉える
再帰型を扱う上で、皆さんに覚えておいてほしいことが一つあります。
それは、「型が複雑になりすぎたら、データ構造（あるいは関数設計）自体を見直すべきである」というサインだということです。TypeScriptの強力な型システムは、複雑な構造を記述できてしまいますが、それゆえに「複雑なものを複雑なまま型で縛り付ける」と、メンテナンス性が死んでしまいます。
- 構造が深すぎるなら：フラットなデータ構造に変換（正規化）できないか考える。
- 型が重すぎるなら：型定義を分割するか、`any` や `unknown` を適切に使って、型安全とコンパイル速度のトレードオフを取る。
TypeScriptをマスターするとは、「言語に何ができるか」を知るだけでなく、「言語に何をさせるべきではないか」という境界線を見極めることです。
—
ここをクリアしたあなたは、もうただのTypeScript初心者ではありません。再帰的なデータ構造を見たときに、その裏側で型評価がどう動いているか、コンパイラがどこで汗をかいているかを想像できるようになったはずです。
その感覚こそが、現場で求められる「伝説のアーキテクト」への第一歩ですよ。ぜひ、ご自身のプロジェクトでも、複雑な階層構造を型でエレガントに記述してみてください。応援しています！