본문으로 건너뛰기

이미 선언했던 타입 다시 쓰기 (Omit)

· 약 4분

타입 선언시, 이미 만들었던 타입을 재활용하려고 보니 필요하지 않은 타입이 껴있어서 재활용하지 못하는 경우가 있었다.분명 다시 재활용할 수 있는 방법이 있을거라 생각했고..역시 있었다.

Omit 이미지

타입을 지정하면서 과거에 사용했던 타입과 하나 차이로 새로운 타입을 새로 만들어 지정하는 경우가 많아졌다.
무언가 방법이 있을 것 같았는데 찾아보지 않고 넘기다가 더 이상 미룰 수 없어서 찾아봤더니 역시나 있었고 해당 내용을 정리해보자.

Omit

생략하다 라는 뜻을 가진 TypeScript의 Utility Types 중 하나로,
특정 타입에서 원하는 타입을 빼고 나머지 타입을 가져올 수 있다.

Omit <가져올 타입, "특정 타입 키(복수 가능)">


Example

여기 메뉴리스트에 쓰이는 타입이 있다.

type MenuListType = {
id: number
title: string
icon: string
navigate: string
}

id, title, icon, navigate 총 4개의 값이 있는 객체에 대한 타입이다.


새로운 리스트 타입을 만들어야할 때, 메뉴리스트 타입을 재활용할 수 있으면 좋겠지만 title 값을 사용하지 않는다면? 다시 타입을 생성해야할까?

Enums 이미지

타입 MenuListType 에서 "title" 이란 키 값을 제외한 타입을 가져오고 싶다면 Omit를 사용하여 아래처럼 작성할 수 있다.

interface AdminMenuListType extends Omit<MenuListType, "title"> {}

또는

type AdminMenuListType = Omit<MenuListType, "title">

"title" 값을 제외하고 "name" 이란 값을 추가해보자.

interface ListType extends Omit<MenuListType, "title"> {
name: string
}

또는

type ListType = Omit<MenuListType, "title"> & { name: string }

두개이상의 타입 제외

type ListType = Omit<MenuListType, "title" | "icon"> & { name: string }

제외할 값이 여러 개라면 | 구분자로 제외할 값에 여러 개를 포함할 수 있다.


이제 타입이 같지만 이름이 달라서 혹은 타입이 몇개 차이로 달라 새로 만든 타입의 경우 Omit를 사용하여 기존의 타입을 재활용할 수 있을 것 같다.


다음에는 Omit의 반대 개념인 Pick 에 대해 공부해봐야겠다.


예시 코드 보러가기