TypeScript 추론 키워드

TypeScript는 예제와 함께 키워드를 추론합니다.


lucaspaganini.com에서 이 기사와 다른 많은 기사를 참조하십시오.

이 기사에서는 infer 키워드를 사용하여 제네릭에서 유형을 추출하는 방법을 보여드리겠습니다. Promise를 예로 들어 보겠습니다.

type UnpackPromise<P> = ✨magic✨

UnpackPromise<Promise<string>> // <- string
UnpackPromise<Promise<number>> // <- number
UnpackPromise<Promise<boolean>> // <- boolean

P가 Promise의 T의 하위 집합인 경우 T를 반환하려고 합니다. 그렇지 않으면 절대 발생해서는 안 되는 일을 나타내는 never 를 반환합니다.

type UnpackPromise<P> = P extends Promise<T> ? T : never;

그러나 T가 아직 존재하지 않기 때문에 작동하지 않습니다.

이것을 함수와 비교해 봅시다. 그러면 제가 의미하는 바를 알게 될 것입니다.

const UnpackPromise = (P) =>
  P === Promise<T>
    ? T
    : never

P는 인수이지만 T는 어디에서 오는 것입니까?

일반 함수에서는 T 라는 변수를 생성하여 이 문제를 해결할 수 있습니다. 이 같은:

const UnpackPromise = (P) =>
  P === Promise<var T>
    ? T
    : never

여기서 infer 키워드가 사용됩니다. 유형 변수 선언과 유사하게 작동합니다.

type UnpackPromise<P> = P extends Promise<infer T> ? T : never;

P가 Promise의 하위 집합인 경우 TypeScript에 Promise의 내부 유형을 유추하고 T라는 유형에 저장하도록 지시합니다. 그런 다음 T 를 반환합니다.

type UnpackPromise<P> =
  P extends Promise<infer T>
    ? T
    : never

UnpackPromise<Promise<string>> // <- string
UnpackPromise<Promise<number>> // <- number
UnpackPromise<Promise<boolean>> // <- boolean
UnpackPromise<Promise<Array<Date>>> // <- Array<Date>
UnpackPromise<Promise<boolean | string>> // <- boolean | string

결론

참조는 아래에 있습니다.
infer 키워드에는 더 많은 것이 있지만 이것이 제가 1분 비디오에 맞출 수 있는 것입니다. TypeScript에 대해 더 깊이 알고 싶다면 TypeScript 축소에 대한 시리즈가 있습니다. 내 블로그에서 전체 시리즈를 무료로 읽을 수 있습니다.

좋아요를 남겨주시고, 좋은 하루 보내시고 곧 뵙겠습니다.

참조

Inferring Within Conditional Types TypeScript Documentation

The never type TypeScript Documentation