深くネストした推論パターン
inferを再帰的に適用して複雑な型を取り出します。
「深くネストした推論パターン」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン3/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全4レッスンが含まれています。
深い推論を行う理由
必要な型が複数のジェネリックの層の内部に埋もれていることがあります。深い推論では、再帰的または連鎖した条件型を使って、その型に到達します。
type DeepUnwrap<T> =
T extends Promise<infer U>
? DeepUnwrap<U>
: T;
type A = DeepUnwrap<Promise<Promise<string>>>; // string再帰的な条件型
TypeScript 4.1 以降では再帰的な条件型がサポートされており、ラッパーの層を1つずつ取り除けます。
type Flatten<T> = T extends Array<infer U> ? Flatten<U> : T;
type B = Flatten<string[][][]>; // stringネストしたジェネリックからの推論
1つの extends 節で複数の infer 変数を連鎖させ、複数の層を同時に取り出せます。
type InnerValue<T> =
T extends Map<any, infer V>
? V extends Set<infer S>
? S
: V
: T;
type C = InnerValue<Map<string, Set<number>>>; // number深くネストしたオブジェクトプロパティの型
再帰型を使うと、オブジェクトの形状をたどって、深くネストしたプロパティの型を取り出せます。
type DeepGet<T, K extends keyof T> =
T[K] extends object ? T[K] : never;
type Nested = { user: { profile: { name: string } } };
type Profile = DeepGet<Nested, "user">; // { profile: { name: string } }配列要素型の深い取り出し
再帰的なラッパー解除と配列処理を組み合わせることで、任意の深さのネストに対応できます。
type ElementType<T> = T extends (infer U)[] ? ElementType<U> : T;
type D = ElementType<number[][][]>; // numberタプル末尾の再帰
末尾再帰によるタプル操作は、型安全なパイプラインや関数合成の型でよく使われるパターンです。
type Last<T extends any[]> =
T extends [...infer _, infer L] ? L : never;
type E = Last<[1, 2, 3]>; // 3深さの制限と実用上の考慮事項
TypeScript は無限ループを防ぐため、再帰の深さを制限しています。再帰は浅く保ち、必要に応じて深さカウンターで上限を設けることを検討してください。
// Deep recursion may hit "Type instantiation is excessively deep"
// Simplify or use branded types to break deep chains共用体の分配における infer
T が共用体の場合、条件型は分配されます。各メンバーが個別に照合され、その結果が共用体として統合されます。
type Unwrap<T> = T extends Promise<infer U> ? U : T;
type F = Unwrap<Promise<string> | Promise<number> | boolean>;
// string | number | booleanレストタプルの推論
infer を使ったレストタプルパターンにより、先頭と末尾への分解や、可変長の型操作が可能になります。
type Init<T extends any[]> =
T extends [...infer I, any] ? I : never;
type G = Init<[1, 2, 3, 4]>; // [1, 2, 3]実例: ネストした API レスポンス
ネストした API レスポンスの型は、infer を連鎖させることでデータ型までラッパーを解除できます。
type ApiResponse<T> = { data: T; status: number };
type UnwrapApi<T> = T extends ApiResponse<infer D> ? D : T;
type H = UnwrapApi<ApiResponse<{ users: string[] }>>; // { users: string[] }復習: 深い推論
深い推論では、再帰的な条件型、複数の infer 変数、構造パターンの照合を組み合わせ、任意の深さにネストしたジェネリック構造から型を取り出します。
確認問題
Flattenの場合、Flattenは何を返しますか。
学んだこと
深くネストした推論では、再帰的な条件型と連鎖した infer パターンを使って、複数のジェネリックラッパーの内部にある型へ到達します。TypeScript の深さ制限を避けるため、再帰には上限を設けてください。
よくある質問
「深くネストした推論パターン」レッスンは無料ですか?
はい。「深くネストした推論パターン」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全4レッスンが含まれています。
「深くネストした推論パターン」で何を学びますか?
inferを再帰的に適用して複雑な型を取り出します。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
TypeScript Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/4です。
「深くネストした推論パターン」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このTypeScript Academyレッスンでコードを書いて実行できますか?
はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。