【TypeScript】オブジェクトの一部のキーを型定義したい【OmitとPickの使い方】

【TypeScript】オブジェクトの一部のキーを型定義したい【OmitとPickの使い方】

はじめに

コジマです。

TypeScriptでオブジェクトの一部のキーを型定義したいときにOmit, Pickというのが使えます。

Omit, Pickの説明

Omitは特定の型から指定したキーを取り除きます
Pickは特定の型から指定したキーのみを使用します

Omit, Pickの使い方

Omitの使い方

以下の例ではPerson型からageを取り除いたPersonWithoutAge型を作成します。

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

type PersonWithoutAge = Omit<Person, 'age'>;

const person: Person = {
  name: 'John',
  age: 30,
  address: '123 Main St',
};

const personWithoutAge: PersonWithoutAge = {
  name: 'John',
  address: '123 Main St',
};

Pickの使い方

以下の例ではPerson型からname, ageのみを使用したPersonInfo型を作成します。

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

type PersonInfo = Pick<Person, 'name' | 'age'>;

const person: Person = {
  name: 'Alice',
  age: 25,
  address: '123 Main St',
};

const personInfo: PersonInfo = {
  name: 'Alice',
  age: 25,
};

さいごに

TypeScriptでうまく型定義できないかな~と悩んでたときに知りました。

やっぱこういうのあったらなぁってものはあるもんですね。

この記事を面白いまたは役に立ったと思ってくれた方は是非私のTwitter(@kojimanotech)を
フォローしてくれたらうれしいです!

以上、コジマでした。

もっと学びたい人はこちら

JavaScriptをもっと学びたいエンジニアのためにおすすめのUdemy講座を紹介いたします!

JavaScript初心者向けの講座です。
HTML、CSSと合わせて学ぶことができます。
フロントエンド開発の基本的な知識を網羅的に学ぶことができます。
個人的には著作権表記についても触れているところが推せますね。
ウェブ開発入門完全攻略コース – HTML/CSS/JavaScript. プログラミングをはじめて学び創れる人へ!

JavaScriptをより深く学びたい人はこちらがおすすめです。
JavaScript初心者を脱するとよりよいコードを書かなければなりません。
つまずきがちなオブジェクト操作や、非同期処理の仕組みについて学ぶこともできるため、JavaScriptの仕組みから深く学ぶことができます。
【JS】ガチで学びたい人のためのJavaScriptメカニズム

気になった人はぜひ見てみてくださいね!


TypeScriptカテゴリの最新記事