Script - 유틸리티타입
타입스크립트 핸드북 - 유틸리티 타입과 실전 프로젝트로 배우는 타입스크립트에서 배운 내용을 정리한 블로그 입니다.
유틸리티 타입은 정의해 놓은 타입을 가공해서 변환시키는 타입 문법이다.
"바퀴를 다시 발명하지 마라(Don't reinvent the wheel)"라는 말이 있듯이 유틸리티 타입을 사용하지 않고 제네릭과 인터페이스로도 변환할 수 있지만, 더욱 간편하게 사용할 수 있다.
- 마치
for loop
를 이용해서 구현하는 대신forEach
reduce
등을 사용하는 것과 같은 느낌이다.
오늘은 유틸리티타입의 대표격인 삼형제를 정리해 보려고 한다.
- Pick
- Omit
- Partial
Pick
아래와 같이 사람에 대한 인터페이스가 있다.
interface PersonDetail {
name: string;
age: number;
address: string;
phoneNum: number;
believer: boolean;
}
PersonDetail
인터페이스에서 개인정보를 보호하기위해 name
과 age
만 가지고 있는 타입을 정의하고 싶다고 생각해 보자.
interface Person {
name: string;
age: number;
}
위와 같이 interface를 재정의 하면 중복 코드들이 발생하게 된다.
이럴때 사용할 수 있는것이 Pick이다.
Pick의 사용방법은 간단하다 첫 번째는 어떤 인터페이스에서 가져올 것이냐, 두 번째는 어떤 key들을 가져올 것이냐 이다.
type Person = Pick<PersonDetail, 'name' | 'age'>
만약 name
만 가지고 오고싶다면 아래처럼 사용해도 된다.
type Person = Pick<PersonDetail, 'name'>
Omit
Omit은 Pick의 반대라고 생각하면 된다. 어떤 key를 가져올 것이냐가 아니고 선택한 key 빼고 나머지를 가져온다.
Pick으로 believer
를 제외한 나머지를 가져올려고 하면 다음과 같이 나머지를 전부 작성해야 해서 코드가 길어진다.
type PersonWithOutBeliever = Pick<PersonDetail, 'name' | 'age' | 'phoneNum' | 'address'>
Omit으로 재 작성하면 다음과 같다
type PersonWithOutBeliever = Omit<PersonDetail, 'believer'>
Partial
Partial은 특정 타입의 부분 집합을 만족하는 타입을 정의한다.
type Person = Partial<PersonDetail>
위와 같이 작성하면 아래와 같이 interface를 재정의 한 효과와 같다.
interface Person {
name?: string;
age?: number;
address?: string;
phoneNum?: number;
believer?: boolean;
}
Author And Source
이 문제에 관하여(Script - 유틸리티타입), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@pest95/TypeScript-유틸리티타입저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)