TypeScript 知っておくべき14個のユーティリティ型の使い方

Typescript-utility
  • URLをコピーしました!

この記事では、TypeScriptで知っておくべき便利なユーティリティ型の使い方について詳しく解説します。

目次

1. Partial<T>

Partial<T> は、型 T のすべてのプロパティをオプショナル(任意)にするユーティリティ型です。これにより、特定のプロパティだけを更新する場合などに役立ちます。

interface Todo {
    title: string;
    description: string;
}
type PartialTodo = Partial<Todo>;

ここでは PartialTodo{ title?: string; description?: string; } として扱われます。

2. Required<T>

逆に Required<T> は、型 T のすべてのプロパティを必須にします。これは、オプショナルなプロパティを持つ型から完全な型を再構築するのに便利です。

interface Props {
    a?: number;
    b?: string;
}
type RequiredProps = Required<Props>;

RequiredProps{ a: number; b: string; } として扱われます。

3. Readonly<T>

Readonly<T> は、型 T のすべてのプロパティを読み取り専用にします。これにより、不変のオブジェクトを作成することができます。

interface Todo {
    title: string;
}
type ReadonlyTodo = Readonly<Todo>;

ReadonlyTodo{ readonly title: string; } として扱われます。

4. Record<K, T>

Record<K, T> は、キーの型 K と値の型 T からオブジェクト型を構築します。これにより、異なるキーに対して同一の型を持つオブジェクトを簡単に作成できます。

type Animal = 'dog' | 'cat';
type Legs = Record<Animal, number>;

Legs{ dog: number; cat: number; } として扱われます。

5. Pick<T, K>

Pick<T, K> は、型 T からプロパティ K を選択して新しい型を作成します。特定のプロパティだけを持つ型が必要な場合に便利です。

interface Todo { title: string; description: string; completed: boolean; } 

type TodoPreview = Pick<Todo, 'title' | 'completed'>;

TodoPreview{ title: string; completed: boolean; } として扱われます。

6. Omit<T, K>

Omit<T, K> は、型 T からプロパティ K を除外して新しい型を作成します。不要なプロパティを除去するのに役立ちます。

interface Todo { title: string; description: string; completed: boolean; } 

type TodoPreview = Omit<Todo, 'description'>;

TodoPreview{ title: string; completed: boolean; } として扱われます。

7. Exclude<T, U>

Exclude<T, U> は、型 T から U に割り当て可能な型を除外します。特定の値を除外したい場合に使います。

type T0 = Exclude<"a" | "b" | "c", "a">;

T0"b" | "c" として扱われます。

8. Extract<T, U>

Extract<T, U> は、型 T から U に割り当て可能な型を抽出します。特定の値のみを抽出したい場合に使います。

type T1 = Extract<"a" | "b" | "c", "a" | "f">;

T1"a" として扱われます。

9. NonNullable<T>

NonNullable<T> は、型 T から nullundefined を除外します。null許容型からnull非許容型を生成するのに使います。

type T2 = NonNullable<string | number | undefined>;

T2string | number として扱われます。

10. ReturnType<T>

ReturnType<T> は、関数型 T の返り値の型を抽出します。関数の返り値を利用する場合に使います。

type T3 = ReturnType<() => string>;

T3string として扱われます。

11. InstanceType<T>

InstanceType<T> は、コンストラクタ関数型 T のインスタンス型を抽出します。クラスインスタンスの型を得るのに使います。

class C { x = 0; y = 0; } 

type T5 = InstanceType<typeof C>;

T5C のインスタンス型 { x: number; y: number; } として扱われます。

12. Parameters<T>

Parameters<T> ユーティリティ型は、関数型 T のパラメータの型をタプルとして抽出します。これにより、関数のパラメータを他の場所で再利用することができます。

function createUser(name: string, age: number, email: string) { 
   // ユーザーを作成するロジック 
} 

type UserParameters = Parameters<typeof createUser>;

この場合、UserParameters[string, number, string] として扱われます。これにより、関数のシグネチャを変更せずに、関数のパラメータを他の関数やコンテキストで利用することが可能になります。

13. Mutable<T>

TypeScriptには Mutable<T> という組み込みのユーティリティ型は存在しませんが、読み取り専用プロパティを持つ型を変更可能なプロパティを持つ型に変換するためのカスタムユーティリティ型を作成することが一般的です。ここでは、一般的なパターンを用いた Mutable<T> の一例を示します。

type Mutable<T> = {
    -readonly [P in keyof T]: T[P];
};

このユーティリティ型は、型 T のすべてのプロパティから readonly 属性を取り除きます。

type ReadonlyUser = {
    readonly name: string;
    readonly age: number;
};

type User = Mutable<ReadonlyUser>;

この場合、User{ name: string; age: number; } として扱われ、元の ReadonlyUser 型のプロパティが変更可能になります。

14. Awaited<T>

Awaited<T> ユーティリティ型は、Promiseから解決される型を抽出します。これは、非同期関数の返り値の型を扱う場合に特に便利です。

type Response = Awaited<Promise<string>>;

この場合、Responsestring として扱われます。Awaited<T> は、特に非同期処理を多用するアプリケーションの型推論を改善するのに役立ちます。

まとめ

以上で、TypeScriptにおける知っておくべき14個のユーティリティ型について説明しました。
これらの型を使いこなすことで、より柔軟で再利用可能なコードを書くことができ、開発の生産性と品質を向上させることが可能になります。

Typescript-utility

この記事が気に入ったら
いいねしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次