ユーティリティ型 ― Partial / Pick / Omit / Record など

導入

「更新用に、全プロパティを省略可能にしたい」「表示用に、一部のプロパティだけ使いたい」といった型の変形は、実務コードで頻繁に出てきます。TypeScript には、こうした定番の変形がユーティリティ型として最初から用意されています。

説明

Partial<T> は、すべてのプロパティを省略可能にした型を作ります。

interface User {
  id: number;
  name: string;
  email: string;
}

type UserUpdate = Partial<User>;   // 全プロパティが ? つき
const update: UserUpdate = { name: "次郎" };   // id, email がなくてもOK
console.log(update);

Pick<T, キー> は、指定したプロパティだけを取り出した型を作ります。

interface User {
  id: number;
  name: string;
  email: string;
}

type UserPreview = Pick<User, "id" | "name">;   // id と name だけ
const preview: UserPreview = { id: 1, name: "太郎" };
console.log(preview);

Omit<T, キー> は Pick の逆で、指定したプロパティを除いた型を作ります。

interface User {
  id: number;
  name: string;
  email: string;
}

type UserWithoutEmail = Omit<User, "email">;
const u: UserWithoutEmail = { id: 1, name: "太郎" };
console.log(u);

Record<キーの型, 値の型> は、決まった形のオブジェクト（辞書）の型を作ります。

type Scores = Record<string, number>;
const scores: Scores = { taro: 80, hanako: 95 };
console.log(scores.taro);

このほかにも、オプショナルなプロパティをすべて必須にする Required<T> や、すべて書き換え不可にする Readonly<T> もよく使われます。名前から役割が想像しやすいので、必要になったときに調べれば十分です。

やってみよう

UserPreview 型の変数に email を追加しようとすると、どんなエラーになるか考えてみましょう（Pick で選ばなかったプロパティは、その型に存在しません）。

演習

interface Product { name: string; price: number; stock: number; } から Pick<Product, "name" | "price"> という型 ProductSummary を作ってください。ProductSummary 型の変数 p に name: "本", price: 1000 を入れ、console.log(p.price) で表示してください。