TypeScript：ユーティリティ型

出力 == {"price":1000}

const patch: Partial = { price: 1000 }; と書く。出力は JSON.stringify を使う。

type Product = { id: number; name: string; price: number };

const patch: Partial<Product> = { price: 1000 };

console.log(JSON.stringify(patch));

Partial は全項目を省略可能にする。更新処理では「変更したい項目だけ渡す」ことが多いので、この型が便利になる。

解答 == B

Partial は「部分的」という意味。

B

すべての項目に ? が付いた型になる。TS08で1つずつ ? を書いていた作業を、まとめて行える。

出力 == {"id":1,"name":"ノートPC"}

type Summary = Pick; と書く。

type Product = {
  id: number;
  name: string;
  price: number;
  category: string;
};

type Summary = Pick<Product, "id" | "name">;

const s: Summary = { id: 1, name: "ノートPC" };

console.log(JSON.stringify(s));

一覧表示では全項目が要らないことが多い。Pick で必要な分だけ取り出せば、余計なデータを持ち回らずに済む。

type Product = { id: number; name: string; price: number };

type NewProduct = ____<Product, "id">;

const draft: NewProduct = { name: "新商品", price: 5000 };
console.log(Object.keys(draft).join(","));

出力 == name,price

「省く」を意味する4文字のユーティリティ型。

Omit

新規作成時は id がまだ存在しない——この状況を Omit でそのまま型にできる。データベースが採番する前の状態を表現できる。

解答 == B

辞書のような対応表。

B

TS11の集計で使った型。{ PC: 2, 周辺機器: 3 } のような、キーが決まっていないオブジェクトを表せる。

出力 == 1：新商品

function create(draft: NewProduct, id: number): Product { return { id, ...draft }; } と書く。

type Product = { id: number; name: string; price: number };
type NewProduct = Omit<Product, "id">;

function create(draft: NewProduct, id: number): Product {
  return { id, ...draft };
}

const p = create({ name: "新商品", price: 5000 }, 1);

console.log(`${p.id}：${p.name}`);

スプレッド構文で id を足して Product に戻している。「id無しで受け取り、id付きで返す」という流れが、型として明確に表現されている。

type Config = { url: string; timeout: number };

const c: ____<Config> = { url: "https://a.com", timeout: 30 };

console.log(c.url);

出力 == https://a.com

「読み取り専用」を意味する8文字のユーティリティ型。先頭は大文字。

Readonly

全項目に readonly が付いた型になる。設定値など、途中で書き換わってほしくないオブジェクトに使う。

解答 == B

ユーティリティ型は元の型から自動生成される。

B

これが重複を書かない最大の利点。元の型を1箇所直すだけで、派生したすべての型に反映されるので、修正漏れが起きない。

出力 == ノートPC：150,000円

return { ...product, ...patch }; とスプレッドでマージする。

type Product = { id: number; name: string; price: number };

function update(product: Product, patch: Partial<Product>): Product {
  return { ...product, ...patch };
}

const original: Product = { id: 1, name: "ノートPC", price: 128000 };
const updated = update(original, { price: 150000 });

console.log(`${updated.name}：${updated.price.toLocaleString()}円`);

これがAPIの更新処理の典型形。変更したい項目だけを送り、サーバー側で既存データとマージする——Partial がその「一部だけ」を型で表現している。

出力 == PC:5, 周辺機器:42

const stocks: Record = { PC: 5, 周辺機器: 42 }; と書く。

const stocks: Record<string, number> = {
  PC: 5,
  周辺機器: 42,
};

console.log(
  Object.entries(stocks)
    .map(([k, v]) => `${k}:${v}`)
    .join(", ")
);

キーが事前に決まっていない対応表を表す型。集計結果やマスタデータの保持に向いている。

出力2行が完全一致

Pick と書く。

type Product = {
  id: number;
  name: string;
  price: number;
  category: string;
  stock: number;
};

type ListItem = Pick<Product, "id" | "name" | "price">;

const list: ListItem[] = [
  { id: 1, name: "ノートPC", price: 128000 },
  { id: 2, name: "マウス", price: 3200 },
];

for (const item of list) {
  console.log(`${item.id}: ${item.name} (${item.price.toLocaleString()}円)`);
}

一覧APIは全項目を返さないことが多い。Pick で「一覧で使う分だけ」の型を作れば、存在しない項目にアクセスするミスを防げる。

出力 == ID:1 新商品 (2026-01-01)

Omit と書く。register で id と createdAt を追加する。

type Product = {
  id: number;
  name: string;
  price: number;
  createdAt: string;
};

type ProductForm = Omit<Product, "id" | "createdAt">;

function register(form: ProductForm, id: number, createdAt: string): Product {
  return { id, createdAt, ...form };
}

const p = register({ name: "新商品", price: 5000 }, 1, "2026-01-01");

console.log(`ID:${p.id} ${p.name} (${p.createdAt})`);

ユーザーが入力する項目と、システムが付与する項目を型で分けている。フォームに createdAt を入力させる、といった設計ミスが起こらない。

出力2行。ノートPC：150,000円 / 新ノートPC：99,000円

スプレッドでマージする。2回とも元の商品から更新する。

type Product = { id: number; name: string; price: number };

function patchProduct(p: Product, patch: Partial<Product>): Product {
  return { ...p, ...patch };
}

const original: Product = { id: 1, name: "ノートPC", price: 128000 };

const a = patchProduct(original, { price: 150000 });
console.log(`${a.name}：${a.price.toLocaleString()}円`);

const b = patchProduct(original, { name: "新ノートPC", price: 99000 });
console.log(`${b.name}：${b.price.toLocaleString()}円`);

元の商品は変更されていないことに注目。スプレッドで新しいオブジェクトを作っているので、元データが壊れない。

出力 == 税率:0.1 送料:800 閾値:5000

既定値を Readonly で定義し、Partial を受け取ってスプレッドでマージする。

type Config = {
  taxRate: number;
  shippingFee: number;
  freeThreshold: number;
};

const DEFAULT: Readonly<Config> = {
  taxRate: 0.1,
  shippingFee: 600,
  freeThreshold: 5000,
};

function mergeConfig(override: Partial<Config>): Config {
  return { ...DEFAULT, ...override };
}

const config = mergeConfig({ shippingFee: 800 });

console.log(
  `税率:${config.taxRate} 送料:${config.shippingFee} 閾値:${config.freeThreshold}`
);

既定値を Readonly にすることで、誤って書き換えられない。マージは新しいオブジェクトを作るので、DEFAULT は常に元のまま保たれる。

出力 == PC：173,000円

reduce> で集計し、Object.entries で絞り込む。

type Product = { name: string; category: string; price: number };

const items: Product[] = [
  { name: "ノートPC", category: "PC", price: 128000 },
  { name: "マウス", category: "周辺機器", price: 3200 },
  { name: "モニター", category: "PC", price: 45000 },
];

const totals = items.reduce<Record<string, number>>((acc, i) => {
  acc[i.category] = (acc[i.category] ?? 0) + i.price;
  return acc;
}, {});

const large = Object.entries(totals).filter(([, v]) => v >= 100000);

console.log(
  large.map(([k, v]) => `${k}：${v.toLocaleString()}円`).join(", ")
);

Object.entries の結果は [string, number][] と推論される。Record の型情報が最後まで追跡されるので、filter や map の中でも安全に扱える。