TIL- TypeScript 유틸리티 타입

Hyeongmin·2024년 3월 8일
0

 TIL (Today I Learned)

목록 보기
45/54

TypeScript의 유틸리티 타입들은 기존의 타입을 변형하여 새로운 타입을 쉽게 만들 수 있게 해주는 일련의 제네릭 타입 헬퍼들이다. 이들은 코드의 재사용성을 높이고, 타입 관련 작업을 보다 간편하게 만들어준다.


몇가지 자주 쓰이는 유틸리티 타입들을 정리해봤다.

Partial< T >

이 유틸리티 타입은 T의 모든 속성을 선택적으로 만든다.
이를 통해 객체의 부분 집합을 표현할 수 있다.
이는 기존 타입의 구조를 유지하면서, 모든 속성을 필수가 아닌 선택적으로 만들고 싶을 때 유용하다.

interface Todo {
  title: string;
  description: string;
}

const updateTodo = (todo: Todo, fieldsToUpdate: Partial<Todo>) => ({
  ...todo,
  ...fieldsToUpdate,
});

Required< T >

Partial의 반대로, T의 모든 속성을 필수로 만든다.

interface Props {
  a?: number;
  b?: string;
}

const obj: Required<Props> = {
  a: 5,
  // 'b'는 필수 속성이므로 제공되어야 합니다.
  b: "string",
};

Readonly < T >

T의 모든 속성을 읽기 전용으로 만든다.
이는 불변 객체를 만들고 싶을 때 유용한다.

interface Todo {
  title: string;
}

const todo: Readonly<Todo> = {
  title: "Delete inactive users",
};

// todo.title = "Hello"; // 오류: 'title'은 읽기 전용 속성이므로 할당할 수 없습니다.

Record<K, T>

K 타입의 키들과 T 타입의 값들로 구성된 객체 타입을 생성한다.
K는 string | number | symbol 타입이어야 한다.
Record 타입은 객체의 모든 키가 같은 타입의 값을 가질 때 유용하게 사용할 수 있다.

interface PageInfo {
  title: string;
}

const pages: Record<string, PageInfo> = {
  home: { title: "Home" },
  about: { title: "About" },
  contact: { title: "Contact" },
};

Pick<T, K>

T에서 속성 K만을 선택하여 타입을 구성한다.

interface Todo {
  title: string;
  description: string;
  completed: boolean;
}

type TodoPreview = Pick<Todo, "title" | "completed">;

Omit<T, K>

Pick의 반대로, T에서 속성 K를 제외한 타입을 구성한다.

interface Todo {
  title: string;
  description: string;
  completed: boolean;
}

type TodoPreview = Omit<Todo, "description">;

Exclude<T, U>

T에서 U에 할당할 수 있는 모든 속성을 제외한 타입을 생성한다.

type T0 = Exclude<"a" | "b" | "c", "a" (a만 제외)>; // "b" | "c"

Extract<T, U>

T에서 U에 할당할 수 있는 모든 속성만을 추출하여 타입을 생성한다.

type T0 = Extract<"a" | "b" | "c", "a" | "f" (a와 f에서 a가 공통된 부분이므로 a만 추출)>; // "a"

0개의 댓글