TypeScript Utility Type의 기반, 조건부 타입(Conditional Type)

Conditional Type에 대한 구구절절한 문법을 설명하는 대신 Utility Type 중 ReturnType의 구현 코드를 살펴보고자 합니다.

ReturnType은 입력된 함수 타입의 반환 타입을 얻는 TypeScript에 이미 정의된 API입니다. 그런데 이 ReturnType은 네이티브가 아닌 TypeScript 언어로 작성된 녀석입니다. 이때 조건부 타입(Conditional Type) 문법이 사용되는데요. ReturnType을 비롯한 대다수의 Utility Type 들은 조건부 타입 문법을 통해 구현되어 있습니다.

ReturnType의 구현 코드는 다음과 같습니다. 실제 구현된 코드와 다를 수 있으나 결과는 동일합니다.

type MyReturnType<T extends (...args: any) => any> =
  T extends (...args: any) => infer R ? R : any;

위의 코드를 사용한 코드를 예시로 보면..

type f = (a: number) => void;
type rt = MyReturnType<f>

f는 void 타입을 반환하는 함수 타입이므로 rt는 void 타입이 됩니다. 기대했던 기능입니다.

이제 MyReturnType에 대한 구현 코드를 살펴보면 …

MyReturnType의 T 인자는 <T extends (...args: any) => any>에 의해 모든 함수의 형태를 포함할 수 있는 함수 타입으로 제약 받고 있습니다. 그리고 T extends (...args: any) => infer R에 의해 다시 T가 정해진 제약 조건, 즉 조건부 타입인지를 검사하고 있고, 조건부 타입 검사를 수행할때 infer R에 의해 R에 대한 타입을 추론(infer)하게 되고 결과적으로 조건에 맞을 경우 추론된 타입인 R이 반환되고 조건에 맞지 않을 경우 any가 반환되도록 하는 것입니다.

답글 남기기

이메일 주소는 공개되지 않습니다. 필수 필드는 *로 표시됩니다