[TypeScript] 다양한 Utility Type이해하기

기본 지식: Index

 

  목  차

• Index Type이란?
• Mapped Type이란?
• Readonly Type
• Pick type
• Omit Type

 

 

---

 

  Index Type이란?

 

type역시 객체 프로퍼티에 접근방법을 동일하게 사용 가능하다.

  예) type gender = User['gender']

 

 

 

  Mapped Type이란?

 

Mapped Type의 기본 문법이다.

여기서 [P in keyof T] 는 객체 반복문인 for...in...문 이라고 생각하면 편하다.

T로 들어오는 타입의 프로퍼티를 빙글빙글 돌며 P에 할당하고, T[P](Index Type)를 통해서 그 속성의 타입을 가져온다.

type MappedType<T> = {
  [P in keyof T]: T[P];
};

 

Mapped type의 예시는 다음과 같다.

type Optional<T> = {
  // 모든 속성을 옵셔널로 만든다.
  [P in keyof T]?: T[P];
};

type User = {
  id: number;
  name: string;
};

type OptionalUser = Optional<User>;  // { id?: number; name?: string; }

 

 

---

Readonly Type

 

  Readonly<T>

모든 속성들을 readOnly로 만들어준다.

type Car = {
  make: string;
  model: string;
}

const toyota: Readonly<Car> = {
  make: 'Toyota',
  model: 'Camry'
}

toyota.make = 'Ford'; // Error! Cannot assign to 'make' because it is a read-only property.

 

Pick Type

 

  Pick<T, K>

T 타입에서 내가 원하는 것만 골라다가 타입을 만들 수 있다.

K는 T의 프로퍼티이다.

 

 

Omit Type

 

  Omit Type<T, K>

T 타입에서 K에 작성된 프로퍼티만 제외시킨다.