🗂

TypeScript の Pick・Exclude・Omit

2021/05/22に公開

概要

TypeScript の Utility Types を読むだけでは理解できないのがあったので触ってみた。
この記事では、PickExcludeOmit の3つを触る。

TL;DR

Omit は、PickExclude を使って表現できる。

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>

Pick<T, K> とは?

T 型から K で選択したプロパティのみを取り出した新しい型を作る。
下記の例だと、T = User, K = 'id' | 'name' となる。

// interface でも可
type User = {
  id: number
  name: string
  age: number
  birthday: string
}

type PickedUser = Pick<User, 'id' | 'name'>  // { id: number, name: string }

Exclude<T, U> とは?

T 型と U 型で共通するプロパティを T 型のプロパティから除いた新しい型を作る。
プロパティの型は関係なく、プロパティ名が同じなら除外される。
下記の例だと、T = User, U = AuthUser となる。

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

type AuthUser = {
  id: number
  name: string
  role: string
}

type AgeOrBirthday = Exclude<keyof User, keyof AuthUser>  // age | birthday

Omit<T, K> とは?

T 型から K で選択したプロパティのみを除いた新しい型を作る。
下記の例だと、T = User, K = 'birthday' となる。

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

type OmittedUser = Omit<User, 'birthday'>

const printUserInfo = (user: OmittedUser) => {
  console.log(`${user.id}: ${user.name}(${user.age})`)
}

Omit は上で紹介した PickExclude を使うことで表現できる。

type MyOmit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>

T = User, K = 'birthday' と置いて、見ていく。

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

type A1 = Exclude<keyof User, 'birthday'> // 'id' | 'name' | 'age'
type A2 = Pick<User, A1> // { id: number, name: string, age: number }

Discussion