[TS] 유틸리티 타입1 - 맵드 타입 기반

유틸리티 타입이란❓

타입스크립트가 자체적으로 제공하는 특수한 타입들이다.

Partial< T >

Partial은 특정 객체 타입의 모든 프로퍼티를 선택적 프로퍼티로 변환한다. 따라서 기존 객체 타입에 정의된 프로퍼티들 중 일부분만 사용할 수 있도록 도와주는 타입이다.

예시를 통해 정리해보면, 다음은 게시글을 표현하는 타입을 정의한 것이다.

interface Post {
  title: string;
  tags: string[];
  content: string;
  thumbnailURL?: string;
}

다음은 임시 저장기능을 하는 타입이다.

interface Post {
  title: string;
  tags: string[];
  content: string;
  thumbnailURL?: string;
}

const draft: Post = { //  tags 프로퍼티가 없음
  title: "임시글",
  content: "임시글 내용",
};

위와 같이 게시글의 일부 정보가 아직 설정되어 있지 않은 임시 저장 게시글의 경우에도 변수에 저장할 수 있어야 하는데 해당 변수를 Post 타입으로 정의하면 오류가 발생하게 된다.

이런 상황에 다음과 같이 Partial< T > 유틸리티 타입을 이용하면 좋다.

interface Post {
  title: string;
  tags: string[];
  content: string;
  thumbnailURL?: string;
}

const draft: Partial<Post> = {
  title: "임시글",
  content: "임시글 내용",
};

Partial< T > 타입은 타입 변수 T로 전달한 객체 타입의 모든 프로퍼티를 다 선택적 프로퍼티로 변환한다.

Required< T >

Required< T >은 특정 객체 타입의 모든 프로퍼티를 필수 프로퍼티로 변환한다.

interface Person {
  name: string;
  age?: number;  
}

const person: Required<Person> = {
  name: "John",
  age: 30,  // age도 필수로 됨
};

Required< Person >을 사용하여 age도 필수 속성으로 바뀌었다.

Readonly< T >

Readonly< T >는 특정 객체 타입의 모든 프로퍼티를 읽기 전용 프로퍼티로 변환한다.
객체의 속성을 수정하지 못하도록 할 때 유용하다.

interface Person {
  name: string;
  age: number;
}

const person: Readonly<Person> = {
  name: "John",
  age: 30,
};

person.name = "Jane";  // name이 읽기 전용이라 에러 

Readonly< Person >을 사용하면 person 객체의 속성을 변경할 수 없게 된다.

Pick<T, K>

Pick<T, K>는 타입 T에서 특정 속성들(K)만 선택하여 새로운 타입을 만드는 유틸리티 타입이다. 주로 객체에서 일부 속성만 필요할 때 유용하다.

아래는 Pick<Person, 'name' | 'age'>를 사용하여 Person 타입에서 name과 age만 선택하여 새로운 타입을 만든 예시이다.

interface Person {
  name: string;
  age: number;
  address: string;
}

type PersonNameAndAge = Pick<Person, 'name' | 'age'>;

const person: PersonNameAndAge = {
  name: "John",
  age: 30,
  // address는 선택되지 않음
};

Omit<T, K>

Omit<T, K>는 Pick<T, K>와 반대의 개념으로, 타입 T에서 특정 속성들(K)을 제외한 나머지 속성들을 새로운 타입으로 만드는 유틸리티 타입이다.

interface Person {
  name: string;
  age: number;
  address: string;
}

type PersonWithoutAddress = Omit<Person, 'address'>;

const person: PersonWithoutAddress = {
  name: "John",
  age: 30,
  // address는 제외됨
};

Record<K, V>

Record<K, V>는 특정 키(K)와 값(V)의 쌍으로 구성된 객체 타입을 만들 때 사용하는 타입이다. K는 key의 타입이고, V는 value의 타입을 의미한다.

다음과 같이 K에는 어떤 프로퍼티들이 있을지 String Literal Union 타입을 할당하고 V에는 프로퍼티의 값 타입을 할당한다.

type Thumbnail = Record<
    "large" | "medium" | "small",
    {url: string}
>;

위 Record 타입은 K에는 “large” | “medium” | “small”이 할당되었으므로 large, medium, small 프로퍼티가 있는 객체 타입을 정의한다. 그리고 각 프로퍼티 value의 타입은 V에 할당한 { url : stirng } 이 된다.

[참고: 인프런 - 한 입 크기로 잘라먹는 타입스크립트 강의]