infer

infer는 조건부 타입에서만 사용이 가능하다.

 

Conditional types ( 조건부 타입 )

조건부타입은 TypeScript에서 특정 조건에 따라 타입을 결정하는 기능이다.

T extends U ? X : Y

형태를 가지며 이는 타입 T가 타입 U에 할당 가능하면 X 타입을 반환하고, 그렇지 않으면 Y 타입을 반환한다는 뜻이다.

 

type IsString<T> = T extends string ? "yes" : "no";

type Test1 = IsString<string>;  // "yes"
type Test2 = IsString<number>;  // "no"

 

infer

조건부 타입 내에서 동적으로 타입을 추론할 때 사용한다

type ReturnTypeOf<T> = T extends (...args: any[]) => infer R ? R : any;
function example() {
    return { data: "string" };
}
type ReturnType = ReturnTypeOf<typeof example>; // { data: string; }

 

infer를 통해 추론한 타입 변수는 참 부분에서만 사용할 수 있다.

이는 생각해보면 당연한데, infer를 통해 추론할 수 있다면 참, 아니라면 거짓으로 가게된다.

추론을 할 수 있기에 사용할 수 있으며 따라서 참에서는 사용이 가능하다.

반대로 추론할 수 없다면 거짓에서는 해당 타입 변수를 어느것으로 사용해야 되는지 결정하지 못함으로 사용하지 못한다.

 

infer의 대표 사용처

내장된 ReturnType<T>

ReturnType<T>는 infer를 사용하여 함수의 반환 타입을 추출한다.

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

function fc(): string {
    return "Hello";
}

type R = ReturnType<typeof fc>;  // string

 

이를 통해 custom hook 등의 반환 타입을 자동으로 추론하는데 사용할 수 있다.

function myAsyncFunction<T extends (...args: any[]) => any>(fn: T): [ReturnType<T>] {
    // logic
}

 

Promise의 결과 값 타입 추출

type UnwrapPromise<T> = T extends Promise<infer R> ? R : T;

async function fc() {
    return { id: 1, name: "John" };
}

type Data = UnwrapPromise<ReturnType<typeof fc>>;  // { id: number, name: string }

 

결론적으로 infer는 래핑상태를 없앨 때 주로 사용된다.

함수, 배열, Promise 등 의 내부 값의 타입을 알아낼 때 주로 사용할 수 있다.