Day 3・ユニオン・絞り込み・ジェネリクス(読める範囲で)
実務で出る便利な型の触り(Record, Partial など)
Record や Partial など、既存の型から新しい型を作るユーティリティ型を読める範囲で知る。
既存の型から新しい型を作る
TypeScriptには、すでにある型を元に別の型を組み立てる「ユーティリティ型」が用意されています。これも <> を使うジェネリクスの一種です。ここでは実務でよく見る Record と Partial を、読める範囲で押さえます。
Record<K, V> は「キーが K 型、値が V 型のオブジェクト」を表します。たとえば「文字列のキーに数値がぶら下がった辞書」を Record<string, number> と書けます。
// 商品名(文字列)ごとに在庫数(数値)を持つ辞書
const stock: Record<string, number> = {
apple: 3,
banana: 5,
};
stock.apple = 10; // OK: 値は数値
stock.cherry = "x"; // エラー: 値は数値でないといけないPartial<T> は「T の全プロパティを省略可能にした型」です。元の型では必須だった項目を、あってもなくてもよい状態にします。更新処理で「一部の項目だけ渡したい」ときによく使われます。
type User = { id: number; name: string; email: string };
// Partial<User> は { id?: number; name?: string; email?: string }
// つまり全部が省略可能
function updateUser(id: number, patch: Partial<User>) {
// patch は name だけ、email だけ、などでもOK
}
updateUser(1, { name: "新しい名前" }); // OK
updateUser(1, {}); // OK(何も更新しない)なぜ元の型から作るのか
User を1つ定義しておけば、Partial<User> は自動的に追従します。User に項目を足せば Partial<User> にも反映されるので、型がバラバラになりません。AIに「更新用の型はPartialで」と伝えれば、二重管理の無い安全な型を作ってくれます。
手で作り直す
更新用に全項目 optional の型を別途手書きする
type UserPatch = {
id?: number; name?: string; email?: string;
}; // User を変えたら手直しが必要元の型から生成
Partial<User> なら User の変更に自動で追従
type UserPatch = Partial<User>; // 二重管理が無い- Record<K, V>: キーが K、値が V のオブジェクト型(辞書のイメージ)
- Partial<T>: T の全プロパティを省略可能にした型(部分更新に便利)
- どちらも既存の型から新しい型を作るので、二重管理を防げる
AIにはこう聞く
「User型を元に、更新用に一部だけ渡せる型を作りたい」と伝えれば Partial<User> を提案してくれます。読めない型が出てきたら「この Record<string, User[]> はどういう構造?」と聞けば、日本語で構造を説明してくれます。
読んでも腑に落ちない所は、AIに噛み砕いてもらいましょう。
理解度チェック
答えられれば、面接で説明できる状態に一歩近づきます。
Record<string, boolean> が表すのはどんな値?
type User = { id: number; name: string } のとき、Partial<User> として正しいものはどれ?
更新処理で Partial<User> を使うと、手書きの更新用型を作るのに比べてどんな利点がありますか。
記述式です。まず自分の言葉で答えを考えてから、模範解答を開いて自己採点してください。