実践で使うT extends U ? X : Y
実用的なConditional Typesを記述し、unionへの分配と、必要に応じて分配を無効にする方法を学びます
「実践で使うT extends U ? X : Y」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン1/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全3レッスンが含まれています。
導入
目標:条件型を使って型システム内のロジックを表現し、条件型がユニオンに対していつ分配されるかを理解します。
- パターン:
T extends U ? X : Y - 分配:ユニオンの各メンバーに対して分岐を適用する
基本パターン
条件型は、Tがstringに代入可能かどうかに基づいて分岐を選択します。
type IsString<T> = T extends string ? true : false
type A = IsString<string>
// ^ true
type B = IsString<number>
// ^ false分配
裸のTを使うと、チェックはユニオンの各メンバーに対して実行されます。string | numberはstring[] | number[]になります。
type ToArray<T> = T extends any ? T[] : never
type C = ToArray<string | number>
// distributes:
// C is string[] | number[]分配を無効にする
Tをタプル([T])でラップすると、分配を防ぎ、ユニオン全体を1つの型として扱えます。
type ToArrayNoDist<T> = [T] extends [any] ? T[] : never
type D = ToArrayNoDist<string | number>
// no distribution:
// D is (string | number)[]実用的なユーティリティ
このパターンの例として、配列の場合、ElementTypeはinferを使って要素の型を取り出します。それ以外の場合は型をそのまま保持します。
type NonEmptyArray<T> = T[] extends [] ? never : T[]
// Usually better:
// type ElementType<T> = T extends ReadonlyArray<infer U> ? U : T
type E1 = ElementType<string[]>
// ^ string
type E2 = ElementType<readonly number[]>
// ^ number
type E3 = ElementType<string>
// ^ stringヒント
ヒント:条件はシンプルに保ち、デプロイ先に注意します。ヘルパー型を再利用し、複雑な組み合わせにはテストファイルを用意します。
// Tips
// - Keep conditions simple; deep nesting harms readability
// - Document distribution behavior for teammates
// - Prefer helper aliases (ElementType, Awaited) for reuse
// - Watch for De Morgan like logic when composing unions分配のチェック
クイックチェック:条件型はいつ分配されるでしょうか。
まとめ
まとめ:条件型は型の中でロジックを表現します。分配はユニオンの各メンバーに適用され、タプルでラップすると分配を無効にできます。
AI チューターと学ぶ TypeScript — 無料
ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。
- コース
- 101
- レッスン
- 352
よくある質問
「実践で使うT extends U ? X : Y」レッスンは無料ですか?
はい。「実践で使うT extends U ? X : Y」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全3レッスンが含まれています。
「実践で使うT extends U ? X : Y」で何を学びますか?
実用的なConditional Typesを記述し、unionへの分配と、必要に応じて分配を無効にする方法を学びます ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
TypeScript Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/3です。
「実践で使うT extends U ? X : Y」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このTypeScript Academyレッスンでコードを書いて実行できますか?
はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- 実践で使うT extends U ? X : Y
- ReturnTypeのようなユーティリティのinfer
- 組み込み型:ReturnType、Parameters、InstanceTypeなど