Featured image of post TypeScriptユーティリティ型完全ガイド:実践的な使用例集

TypeScriptユーティリティ型完全ガイド:実践的な使用例集

Partial、Required、Pick、Omit、Extract、Exclude、Record、NonNullable、Parameters、ReturnTypeなど、TypeScriptの組み込みユーティリティ型を実例で徹底解説。

TypeScriptには、他の型を変換・操作する豊富な組み込みユーティリティ型が用意されています。これらを理解することで、車輪の再発明をせずに、より表現力豊かで型安全なコードを書けます。

プロパティ変更型

これらの型はオブジェクトのプロパティのオプション性、可変性、必須性を変更します:

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

type PartialUser = Partial<User>;
// { id?: number; name?: string; email?: string; }

type RequiredUser = Required<User>;
// { id: number; name: string; email: string; }
効果主な使用例
Partial<T>全プロパティをオプション化PATCHリクエスト本文
Required<T>全プロパティを必須化フォーム送信バリデーション
Readonly<T>全プロパティを読み取り専用に不変設定オブジェクト

PartialはAPIの更新操作で特に便利です:

async function updateUser(id: number, changes: Partial<User>): Promise<User> {
  const res = await fetch(`/api/users/${id}`, {
    method: 'PATCH',
    body: JSON.stringify(changes),
  });
  return res.json();
}

プロパティ選択型

PickOmitで特定のプロパティを選択または除外できます:

type UserView = Pick<User, 'id' | 'name'>;
type SafeUser = Omit<User, 'password' | 'token'>;

これらの型は交差型と組み合わせることで細かな制御が可能です:

type UserProfile = Pick<User, 'name' | 'email'> & { bio?: string };

ユニオン型フィルタリング

ExtractExcludeは型の互換性に基づいてユニオンメンバーをフィルタリングします:

type Status = 'idle' | 'loading' | 'success' | 'error';
type ActiveStatus = Exclude<Status, 'idle'>;
// 'loading' | 'success' | 'error'

NonNullable<T>はnullとundefinedを除去します:

type Definite = NonNullable<string | null | undefined>; // string

オブジェクト構築型

Record<K, T>は指定されたキー型と値型を持つオブジェクト型を作成します:

type RolePermissions = Record<'admin' | 'editor' | 'viewer', string[]>;

関数・クラス型

関数シグネチャから型情報を抽出します:

type Fn = (a: string, b: number) => boolean;
type Params = Parameters<Fn>;    // [string, number]
type Ret = ReturnType<Fn>;       // boolean

Awaited<T>はPromise型を再帰的にアンラップします:

type AsyncResult = Awaited<Promise<Promise<string>>>; // string

合成パターン

ユーティリティ型を組み合わせることで表現力が広がります:

type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
type DeepPartial<T> = {
  [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
};

ユーティリティ型の習得はボイラープレートを削減し、型安全性を向上させます。PartialPickRecordから始め、徐々に高度な型を取り入れていきましょう。