Zenn
🎃

組み込みユーティリティ型

2020/10/02に公開
TypeScript
tech

はじめに

Typescriptで書かれた記事を読むにあたってこれなんや？と思うことが多いユーティリティ型について、自分への備忘録として記事にします。

組み込みユーティリティ型とは

​type Fig = "one" | "two" | "three";
type FigMap = { [k in Fig]: number };
const figMap: FigMap = {
  one: 1,
  two: 2,
  three: 3,
};
};

前回の記事(型演算子)のコードです。
このマップ型ですが、以下のように書いても同様の結果となります。

​type Fig = "one" | "two" | "three";
type FigMap = Record<Fig, number>;
const figMap: FigMap = {
  one: 1,
  two: 2,
  three: 3,
};

{ [k in Fig]: number }をRecord<Fig, number>に置き換えました。このジェネリクスを用いて記載されたRecord<>こそが、TypeScriptが提供してくれているユーティリティ型といいます。
他にもたくさんのユーティリティ型がありますが、ここではよく目にするユーティリティ型を紹介します。

Partial

type Partial<T>・・・型 T のすべてのプロパティを省略可能(つまり| undefined)にした新しい型を返す

​type Person = {
  name: string;
  age: number;
};

type PartialPerson = Partial<Person>;

Required

type Required<T>・・・ 型 T の全てのプロパティを必須にした新しい型を返す

type Person = {
  name: string;
  age: number;
};

type ReqPerson = Required<Person>;

Readonly

type Readonly<T>・・・… 型 T のプロパティをすべて読み取り専用にした新しい型を返す

​type Person = {
  name: string;
  age: number;
}

type ReadPerson = Readonly<Person>;

またプロパティの一部を読み取り専用にしたい場合は以下のとおりです。

​type Person = {
  readonly name: string;
  age: number;
};

Pick

type Pick<T,K>・・・T(オブジェクト型) から K が指定するキーのプロパティだけを抜き出す

​type Person = {
  name: string;
  age: number;
  gender: "male" | "female";
};

type PickName = Pick<Person, "name">;

また2つ以上のプロパティを抜き出したいときは | でつなぎ合わせます。

​type Person = {
  name: string;
  age: number;
  gender: "male" | "female";
};

type PkNameGender = Pick<Person, "name"|"gender">;

Omit

Ommit<T,K> ・・・ T から K が指定するキーのプロパティを省く

​type Person = {
  name: string;
  age: number;
  gender: "male" | "female";
};

type OmittedPerson = Omit<Person, "age">;

Extract

Extract<T,U> ・・・ T から U の要素だけを抜き出す

​type Fuga = "AAA" | "BBB" | "CCC";
type FugaAB = Extract<Fuga, "AAA" | "BBB">;

Exclude

Exclude<T,U> ・・・ T から U の要素を省く

​type Fuga = "AAA" | "BBB" | "CCC";
type FugaAB = Exclude<Fuga, "CCC">;

Discussion