[10.18] 타입스크립트 - 유틸리티(Pick,Omit)

유틸리티

• 유틸리티 타입
• Pick
• Omit

타입스크립트에서 유틸리티 타입이란?

이미 정한 타입을 변환해서 사용하기 좋은 타입들을 총 칭하는 말이다.
인터페이스, 제네릭 등 기본문법으로 타입변환을 할 수 있지만 유틸리티 타입을 통해 더 간결하게 변환이 가능하다.

상품 목록 받아오기 위한 API 기본함수 타입형태를 예시로 들어보겠다.
ex) Product 프로미스를 배열로 받아온다고 가정했을땐 다음과 같은 모습이다.

 function fetchProducts():Promise<Product[]>{
 }

Pick

Product interface 중 일부 상품정보만 보여주고 싶을때 Pick 이라는 유틸리티를 사용하여 interface 의 중복을 피할 수 있다.

 interface ShoppingItem {
   id : number;
   name : string;
   price : number;
}

function displayProductDetail(shoppingItem:ShoppingItem){
}

type 별칭으로 선언하여 불필요한 코드들이 줄어들고 깔끔하게 타입정의가 가능하다.

type ShoppingItem = Pick<Product,'id'|'name'|'price'>;
function displayProductDetail(shoppingItem:Pick<Product,'id'|'name'|'price'>){
}

Omit

pick 과는 반대되는 개념으로, 특정 타입에서 안쓸것들을 빼고 나머지를 쓰겠다.

interface AddressBook {
  name : string;
  phone : number;
  address : string;
  company : string;
}
const phoneBook : Omit<AddressBook,'address'> = {
  name : '재택근무',
  phone : 123456789,
  company : '내 방'
}
const chingtao : Omit<AddressBook,'address' | 'company'>={
  name : 'pizza',
  phone : 61029394550
}