티스토리 뷰

목차

    🐶 infer

    inference 
    추론하다

    조건부 타입 내에서 특정 타입을 추론하는 문법

     

    특정 함수 타입에서 반환값의 타입만 추출하는 특수한 조건부 타입을 만들 때 이용한다.

    type FuncA= () => string;
    
    type FuncB = () => number;
    
    // 조건부 타입
    type ReturnType<T> = T extends () => infer R? R : never;
    // infer R -> 조건식을 참으로 만드는 타입을 추론하도록 동작
    // () => string 일 때 R = string
    // () => number 일 때 R = number
    
    type A = ReturnType<FuncA>; // string
    
    type B = ReturnType<FuncB>; // number
    
    type C = ReturnType<number>; // never 추론이 불가능한 경우에는 거짓

    조건식 T extends () => infer R 이 참이면 R, 거짓이면 never 타입으로 설정한다.

    여기서 infer R은 조건식을 참이 되도록 만들 수 있는 최적의 R 타입을 추론하라는 의미이다.

    • A 타입: 타입 변수 T에 함수 타입 FuncA를 할당 
      1. T는 () => string이 됨
      2. 조건식은 () => string extends () => infer R? R : never
      3. 조건식을 참으로 만드는 R 타입은 string
      4. 추론이 가능하기 때문에 조건식은 참
      5. 결과는 string이 됨
    • B 타입: 타입 변수 T에 함수 타입 FuncB를 할당
      1. T는 () => number이 됨
      2. 조건식은 () => number extends () => infer R? R : never
      3. 조건식을 참으로 만드는 R 타입은 number
      4. 추론이 가능하기 때문에 조건식은 참
      5. 결과는 number가 됨
    • C 타입: 타입 변수에 Number 타입을 할당 -> 추론이 불가능하므로 거짓 => never

     

     

     

     

     

     

     

     

     

     

     

    예제1. Promise의 resolve 타입 추출하기

     

    type PromiseUnpack<T> = T extends Promise<infer R>? R : never;
    // 조건 1. T는 프로미스 타입이어야 함
    // 조건 2. 프로미스 타입의 결과값 타입을 반환해야 함
    
    type PromiseA = PromiseUnpack<Promise<number>>;
    // infer R -> number 
    // number
    
    type PromiseB = PromiseUnpack<Promise<string>>;
    // infer R -> string
    // string

    Promise의 resolve 타입을 infer를 이용해 추출하기 위해서는

    1. T는 프로미스 타입이어야 한다.
    2. 프로미스 타입의 결과값 타입을 반환해야 한다.

    두 조건을 만족해야 한다.

     

    첫 번째 조건을 만족시키기 위해 타입 변수 T는 Promise 타입의 서브 타입임을 만족시키는 조건식을 만든다.

    두 번째 조건을 만족시키기 위해 조건식이 참이 되도록 하는 타입을 추론하는 infer R 타입을 타입 변수로 설정한다.

    • PromiseA 는 Promise<number>를 타입 변수로 넘겨 R은 number가 됨
    • PromiseB 는 Promise<string>을 타입 변수로 넘겨 R은 string이 됨

     

     

     

     

     

     

     

     


    🔗 타입스크립트 강의

     

    한 입 크기로 잘라먹는 타입스크립트(TypeScript) - 인프런 | 강의

    문법을 넘어 동작 원리와 개념 이해까지 배워도 배워도 헷갈리는 타입스크립트 이제 제대로 배워보세요! 여러분을 타입스크립트 마법사🧙🏻‍♀️로 만들어드립니다., 프론트엔드의 피할 수

    www.inflearn.com

     

    728x90