0Pricing
TypeScript Academy · レッスン

Conditional Types(入門)とunionへの分配

Conditional Types(T extends U ? X : Y)と、強力な型レベルのロジックを可能にするunionへの分配を学びます

「Conditional Types(入門)とunionへの分配」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン2/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全3レッスンが含まれています。

導入

目標:条件型(T extends U ? X : Y)を使って型レベルで分岐し、正確な結果を得るためのユニオンに対する分配を理解します。

基本的な条件型

条件型は、T extends Uが成り立つかどうかに応じて、2つの型のいずれかを返します。

type IsString<T> = T extends string ? true : false;

let a: IsString<string>;   // true
let b: IsString<number>;   // false

分配

裸の型パラメーターTを使うと、条件型はユニオンの各メンバーに対して実行され、その結果がユニオンになります。

type ToArray<T> = T extends any ? T[] : never;

type R1 = ToArray<string | number>; // string[] | number[]

分配の停止

Tをタプル(例:[T])で囲むと分配を停止し、ユニオン全体を1つのまとまりとして扱えます。

type ToArrayNoDistrib<T> = [T] extends [any] ? T[] : never;

type R2 = ToArrayNoDistrib<string | number>; // (string | number)[]

実践的なExclude

多くのユーティリティ型は分配に依存しています(例:Exclude、Extract)。独自のバリエーションも簡単に作成できます。

type MyExclude<T, U> = T extends U ? never : T;

type R3 = MyExclude<"a" | "b" | "c", "b">; // "a" | "c"

ヒント

ヒント:

  • 分配が発生するのは、extendsの左側に裸の型パラメーターがある場合だけです。
  • 分配を無効にするには、タプルで囲んでください。
  • 直感どおりの結果になることを、小さな例で確認してください。

分配の確認

クイックチェック:条件型がユニオンに対して分配されるのはなぜですか?

まとめ

まとめ:型レベルの分岐には条件型を使います。結果がユニオンに対していつ分配されるかを理解し、タプルで囲んで分配を無効にする方法を学びました。

よくある質問

「Conditional Types(入門)とunionへの分配」レッスンは無料ですか?

はい。「Conditional Types(入門)とunionへの分配」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全3レッスンが含まれています。

「Conditional Types(入門)とunionへの分配」で何を学びますか?

Conditional Types(T extends U ? X : Y)と、強力な型レベルのロジックを可能にするunionへの分配を学びます ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。

TypeScript Academyを始めるのに経験は必要ですか?

事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/3です。

「Conditional Types(入門)とunionへの分配」レッスンにはどのくらい時間がかかりますか?

ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。

このTypeScript Academyレッスンでコードを書いて実行できますか?

はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。

このコースのすべてのレッスン

  1. ジェネリックinterfaceとtype alias
  2. Conditional Types(入門)とunionへの分配
  3. データモデルの再利用可能なパターン
← TypeScript Academyに戻る