일부만 옵셔널로 바꾸고 싶을 경우

Tags
type
설명
Optional 이라는 커스텀 타입 선언
개요결과Optional 커스텀 타입사용법
 

개요

기존 타입에서 일부 키들만 옵셔널로 변경하고 싶을 경우에 사용할 수 있는 타입이 필요했다.
 
생각 그대로 만든다고 했을 때는 아래와 같은 결과물이 나왔다.
// 기존 타입에서 유지하고 싶은 부분들 추출 & 기존 타입에서 옵셔널로 두고 싶은 부분들 추출

type Optional<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
 

결과

서치 해보니 더 깔끔한 대안이 있어서 이걸로 쓰기로 했다.
💡
똑같은 키값으로 옵셔널 & 필수가 연산 시 필수가 우선순위가 더 높다. 그래서 필수에서 제거 후 옵셔널로 추가해줘야 한다.

Optional 커스텀 타입

// 전체를 옵셔널로 변경 & 기존 타입을 유지하고 싶은 것들
type Optional<T, K extends keyof T> = Omit<T, K> & Partial<T>;

사용법

type Test = {
  A: string;
  B: string;
  C: string;
  D?: string;
};

// Optional<원본타입, 추가로 옵셔널로 두고싶은 키들 나열>
type Test1 = Optional<Test, "A">;
type Test2 = Optional<Test, "B" | "C">;
 
// 기존 타입에서 A 키를 추가로 옵셔널로 만들었다.
// 그래서 B,C만 필수 키가 되었다.
type Test1 = Optional<Test, "A">;
const test1: Test1 = {
  B: '',
  C: ''
}

// 기존 타입에서 B와 C를 추가로 옵셔널로 만들었다
// foo만 필수 키가 되었다.
type Test2 = Optional<Test, "B" | "C">;
const test2: Test2 = {
  foo: ''
}