Intersection TypesとUnion Types
Intersection Typesで複数の型を1つに結合し、Union Typesで柔軟な型の選択肢を作る方法を学びます。
「Intersection TypesとUnion Types」はCoddyKit上の無料TypeScript Academyレッスンです。 これはレッスン3/3です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはTypeScript Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 TypeScript Academyコースには全3レッスンが含まれています。
交差型とユニオン型の概要
交差型とユニオン型の概要
TypeScriptの交差型とユニオン型を使うと、型を組み合わせたり、柔軟な型を作成したりできます。これにより、複雑なデータ構造を定義するための強力な方法が得られます。

ユニオン型とは
ユニオン型とは
ユニオン型を使うと、値が複数の型のいずれかになります。|演算子を使ってユニオン型を定義できます。
ユニオン型の例
ユニオン型の例
ユニオン型の使用例を見てみましょう。
type Status = 'active' | 'inactive' | 'suspended';
let userStatus: Status;
userStatus = 'active'; // Valid
userStatus = 'pending'; // Error交差型とは
交差型とは
交差型は複数の型を1つにまとめたもので、結合後の型には、交差させたすべての型のプロパティが必要になります。
交差型の例
交差型の例
交差型の使用例を見てみましょう。
type User = {
name: string;
email: string;
};
type Admin = {
role: string;
};
type AdminUser = User & Admin;
const admin: AdminUser = {
name: 'Alice',
email: 'alice@example.com',
role: 'admin'
};ユニオン型と交差型の違い
ユニオン型と交差型の違い
ユニオン型では値が複数の型のいずれかになります。一方、交差型では複数の型を1つにまとめるため、すべてのプロパティが存在する必要があります。
実践的な使用例
実践的な使用例
ユニオン型は複数の入力型を扱うのに適しており、交差型は複数の役割や機能を1つの型にまとめるのに適しています。
練習課題
練習課題
交差型を使って、Product型とDiscount型を組み合わせた型を作成してください。その型を使って変数を宣言しましょう。
ユニオン型と交差型の復習
おめでとうございます!
TypeScriptで柔軟な型や複合的な型を定義するための、ユニオン型と交差型の使い方を学びました。これらの概念を練習して、コードの堅牢性と型安全性を高めましょう。

よくある質問
「Intersection TypesとUnion Types」レッスンは無料ですか?
はい。「Intersection TypesとUnion Types」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、TypeScript Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 TypeScript Academyコースには全3レッスンが含まれています。
「Intersection TypesとUnion Types」で何を学びますか?
Intersection Typesで複数の型を1つに結合し、Union Typesで柔軟な型の選択肢を作る方法を学びます。 ブラウザで直接実行するハンズオンコードでTypeScript Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
TypeScript Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのTypeScript Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン3/3です。
「Intersection TypesとUnion Types」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このTypeScript Academyレッスンでコードを書いて実行できますか?
はい。すべてのTypeScript Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- KeyofとLookup Types
- Mapped Types
- Intersection TypesとUnion Types