study/JavaScript & TypeScript

TypeScript 내장 유틸리티 타입: Partial, Omit, Pick

836586697769 2024. 6. 27. 14:50

Partial

Partial<T>: 제네릭 타입 T의 모든 속성이나 필드를 선택적으로 사용할 수 있음

  • 객체의 일부 속성만 업데이트하거나 사용할 때 유용
interface Todo {
    title: string;
    description: string;
}

type PartialTodo = Partial<Todo>;
const todo1: PartialTodo = {}; // (O)
const todo2: PartialTodo = { title: 'Learn TypeScript' }; // (O)
const todo3: PartialTodo = { title: 'Learn TypeScript', description: 'Study', }; // (O)

 

Omit

Omit<T, K>: 제네릭 타입 T에서 속성 K를 제외한 새로운 타입을 생성

  • 기존 타입에서 특정 필드를 제외하고 필요한 필드만 포함하는 새로운 타입을 정의할 때 유용
interface Todo {
    title: string;
    description: string;
    completed: boolean;
}

type OmitTodo = Omit<Todo, 'completed'>;

const todo: OmitTodo = {
    title: 'Learn TypeScript',
    description: 'Study',
};

 

Pick

Pick<T, K>: 제네릭 타입 T에서 속성 K만 선택하여 새로운 타입을 생성

  • 기존 타입에서 필요한 필드만 선택하여 새로운 타입을 정의할 때 유용
interface Todo {
    title: string;
    description: string;
    completed: boolean;
}

type PickTodo = Pick<Todo, 'title' | 'completed'>;

const todo: PickTodo = {
    title: 'Learn TypeScript',
    completed: true,
};

 

유틸리티 타입 사용의 장점

  • 반복적인 패턴을 정의하고 재사용하기 쉬움
  • TypeScript의 타입 시스템을 활용하여 내장 타입 검사와 안전성 보장 가능→ 복잡한 타입 변환 작업이나 타입 체크를 자동화할 때 유용
  • but 개발의 특정 상황이나 요구사항에 맞추어 별도의 타입을 정의하는 것도 고려하기!

'study > JavaScript & TypeScript' 카테고리의 다른 글

JavaScript의 원시타입과 참조타입  (0) 2024.07.05
Jest에서 toBe와 toEqual의 차이점  (0) 2024.07.05
옵셔널 체이닝 (Optional Chaining)  (0) 2023.12.18
Shorthand Property  (1) 2023.12.08
JS 비구조화 할당  (0) 2023.11.06