TypeScript Record<K, T>ユーティリティ型の解説

Record<K, T>が指定されたキーと値の型でオブジェクト型を作成する方法を学びます。辞書、ルックアップテーブル、型付きキーバリューストアの例を紹介します。

Object Types

詳細な説明

Record<K, T>の理解

Record<K, T>はプロパティキーがKでプロパティ値がTのオブジェクト型を構築します。辞書やルックアップテーブルに最適なユーティリティ型です。

構文

type Record<K extends keyof any, T> = {
  [P in K]: T;
};

基本的な例

type Role = "admin" | "editor" | "viewer";

interface Permission {
  read: boolean;
  write: boolean;
  delete: boolean;
}

type RolePermissions = Record<Role, Permission>;
// 以下と同等:
// {
//   admin: Permission;
//   editor: Permission;
//   viewer: Permission;
// }

インデックスシグネチャとRecordの比較

// これらは同等:
type Dict1 = Record<string, number>;
type Dict2 = { [key: string]: number };

Recordはより読みやすく、特にユニオンキーで合成しやすいです。

実践パターン: フィーチャーフラグ

type FeatureFlag = "darkMode" | "newDashboard" | "betaAPI";

const flags: Record<FeatureFlag, boolean> = {
  darkMode: true,
  newDashboard: false,
  betaAPI: true,
};
// TypeScriptがすべてのフラグが存在しbooleanであることを保証

実践パターン: ステータスベースのレンダリング

type Status = "loading" | "success" | "error";

const statusMessages: Record<Status, string> = {
  loading: "お待ちください...",
  success: "操作が完了しました!",
  error: "エラーが発生しました。",
};

ユースケース

Record<K, T>は型付き辞書、ルックアップテーブル、既知のキーを持つ設定オブジェクト、キーと値の両方が型チェックされるべきマップ構造に使用します。

試してみる — TypeScript Utility Types

フルツールを開く