타입스크립트 유틸리티 타입 (파셜, 픽, 오밋) 정리

유틸리티 타입

- 타입을 정의할 때 간결한 문법을 사용할 수 있게 해준다.

- 이미 정의해 놓은 타입을 변환할 때에 사용하기 좋은 타입 문법이다.

- 유틸리티 타입을 꼭 쓰지 않아도 기존의 인터페이스, 제네릭 등으로 충분히 가능하긴 하다.

 

종류는 겁나 많지만 자주 쓸 것 같은 파셜, 픽, 오밋을 정리해보자.

 

 

🔵 파셜 (Partial)

interface Address {
    email: string;
    address: string;
}

// Partial를 활용한 타입
type Email = Partial<Address>;

const email1: Email = {}; // OK
const email2: Email = { email: 'abc' }; // OK
const email3: Email = { email: 'abc', adress: 'abc' }; // OK

- 집합의 모든 프로퍼티를 선택적으로 타입을 생성.

- 특정 타입의 '부분 집합'을 만족하는 타입.

- 이 유틸리티는 주어진 타입의 모든 하위 타입 집합을 나타내는 타입을 반환.

 

 

🔵 픽 (Pick)

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

// Pcik으로 title과 completed만 가져온 타입 생성
type TodoPreview = Pick<Todo, "title" | "completed">;

const todo: TodoPreview = {
    title: "Clean room",
    completed: false,
};

- 특정 타입에서 몇 개의 속성만 선택해서 타입을 정의할 수 있음.

 

 

🔵 오밋 (Omit)

interface Todo {
    title: string;
    description: string;
    completed: boolean;
}
 
// Omit으로 description 속성을 뺀 타입 생성
type TodoPreview = Omit<Todo, "description">;
 
const todo: TodoPreview = {
    title: "Clean room",
    completed: false,
};

- 특정 타입에서 지정된 속성만 제거한 타입을 정의해준다.

- 픽과 반대로 선택된 애들이 제거

 

 

다음에 다른 유틸리티 타입들도 추가로 정리해봐야겠따.

---

 

참고 강의 : https://taylog.tistory.com/217

[강의리뷰] 실전 프로젝트로 배우는 타입스크립트 시리즈 강의 후기 (캡틴판교) 😱 타입스크립

 

 

https://www.typescriptlang.org/ko/docs/handbook/utility-types.html#omittype-keys

Documentation - Utility Types