TypeScript - Pick<Type, Keys>

오늘의 type-challenges는 여기!
오늘은 Pick이라는 TypeScript Built-in generic을 알아본다.
공식 문서에서 Pick의 정의를 살펴보면 다음과 같다.

Constructs a type by picking the set of properties Keys (string literal or union of string literals) from Type

즉, 이미 만들어져있는 타입에서 키를 가지고 뽑아내 새로운 타입을 정의하는 '유틸리티 타입'에 해당한다.
그럼 여기서 유틸리티 타입은 어떤 의미일까?

예제 코드는 아래와 같다.

interface Todo {
  title: string;
  description: string;
  completed: boolean;
}
type TodoPreview = Pick<Todo, "title" | "completed">;
const todo: TodoPreview = {
  title: "Clean room",
  completed: false,
};
console.log(todo);

//  [LOG]: {
//  "title": "Clean room",
//  "completed": false
//  }

그럼, 챌린지에 맞춰 pick을 구현해보자.
먼저 pick이 작동하려면 입력받은 객체에서 넘겨받은 키만을 리턴해야한다.
위 예제 코드에서 만일 내가 Todo 객체에서 키를 뽑는다면?
이럴땐 keyof 타입 연산자를 사용한다.

type Point = { x: number; y: string };
type P = keyof Point;
// 이렇게 작성하면, type P는 x 또는 y와 동일한 타입입니다. 

정리하면 keyof 연산자는 이미 선언 된 타입의 일부 타입을 반환한다는 것이다.
그럼 이 keyof 연산자로 아래와 같이 키를 뽑아 Pick 유틸리티 타입을 구현할 수 있다.

// 1. keyof 연산자 사용
type myPick<T, K extends keyof T> ={
  [P in K]: T[P]
}

여기서, 아직 유틸리티 타입의 종류와 extends에 대해서도 더 알아보아야 하는데 다음 게시글을 작성해보면서 알아보자!