【5分でわかる】OmitとPickの使い方 | TypeScript入門

この記事ではTypeScriptにおけるOmitとPickの使い方をご紹介します。

Omitの使い方

Omitの使い方をご紹介します！

Omitは、事前に定義した型の一部変数に対し、指定した変数を除外して、指定した変数以外の変数で新たな型として定義し、利用することができます。

例えば以下のような方があったとします。

type User = {
  id: number;
  name: string;
  age: number;
};

この方を再利用しつつname以外の変数を利用して、新たな方を定義したい場合、以下のように記載します。

type NewUser = Omit<User, 'name'>;

このようにすると、実質NewUserの定義は、User型からname変数を除く以下のような変数が定義されることになります。

type NewUser = {
   id: number;
   name: string;
   age: number; 
};

既存で定義されている型に対して複数の変数を一度で除外したい場合は、以下のように|でつなぐことで実現できます。

type User = {
  id: number;
  name: string;
  age: number;
};

type Remove = "name" | "age";
type NewUser = Omit<User, Remove>;

Pickの使い方を紹介します！

PickはOmitと逆で、事前に定義した方の変数を指定することで、指定した変数で定義されることになります。

具体的には以下のように記載します。

type User = {
  id: number;
  name: string;
  age: number;
};

type NewUser = Pick<User, 'name'>;

上記で設定した場合、NewUserは以下の方の状態と同義になります。

type NewUser = {
  name: string;
};

今回はnameしかPickに設定していないので、上記のような形になります。

今回はTypeScriptにおけるOmitとPickの使い方を紹介しました。

いかがだったでしょうか？

ぜひこの機会に習得してみてください。

きむら

ここまで記事を読んでいただきありがとうございました♪