관리 메뉴

Jerry

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part3. Utility Types- (22) : infer 타입 분석 본문

Front/Typescript

[TIL] [타임어택9기][리뉴얼] 타입스크립트 올인원 : Part3. Utility Types- (22) : infer 타입 분석

juicyjerry 2024. 3. 5. 23:51
반응형
infer 타입 분석

 

 

 

 

 

 

 

 임의의 함수에 대해서 해당 파라미터와 리턴값을 자유자재로 뜯어올 수 있다.

 

 

 

 

 

parameters 유틸리티

function zip(x: number, y:string, z: boolean): { x: number, y: string, z: boolean } {
    return { x, y, z };
}

type Params = Parameters<typeof zip>; // Params는 튜플 형식
type First = Params[0];
type Second = Params[1];
type Third = Params[2];

 

 

 

 

 

 

 

 

 

parameters 직접 만들기

function zip(x: number, y:string, z: boolean): { x: number, y: string, z: boolean } {
    return { x, y, z };
}

type P<T> = ... // before
type P<T extends (...args: any) => any> = T extends (...args: infer A) => any ? A : never; // after

type Params = Parameters<typeof zip>; // Params는 튜플 형식
type First = Params[0];
extends (...args: any) => any : 함수 제한 두는 법 (함수 제약 조건)
infer는 extends에서만 사용 가능
추론 조건 ? 추론 성공 시의 값 : 추론 실패 시의 값

 

 

after 부분 코드를 보았을 때, 앞과 뒤의 의미는 다르다

여기서 은 "type P<T extends (...args: any) => any>" 를 가리킨다.

는 "T extends (...args: infer A) => any ? A : never;" 를 가리킨다.

 


: T는 무조건 함수
: infer와 새로운 제네릭 A가 등장했는데, 타입스크립트가 알아서 매개변수 자리를 추론(순서대로)하라는 뜻

추론 값이 있으면 A, 없으면 쓰지마라, 매개변수 x: number, y:string, z: boolean 를 차례대로 추론

 

 

 

 

 

 

 

 

ReturnType 유틸리터

리턴 타입을 가져오고 싶을 경우 (x: number, y: string, z: boolean) 

type R<T extends (...args: any) => any> = T extends (...args: any) => infer B ? B : never;
type Ret = R<typeof zip>;

// 실제 존재
type Ret1 = ReturnType<typeof zip>;

 

 

 

 

 

 

 

 

 

 

 

 

ConstructorPamrameters, InstanceType 유틸리티

 

1) 제한(앞) : T extends abstract new (...args: any) => any 

    - T가 constructor라는 걸 알려주는 타입이 abstract new (...args: any) => any이다

2) 제한(뒤) : T extends abstract new (...args: infer P) => any

type ConstructorPamrameters<T extends abstract new (...args: any) => any> = T extends abstract new (...args: infer P) => any ? P : never;

 

 

 

 

1) 제한(앞) : T extends abstract new (...args: any) => any
2) 제한(뒤) : T extends abstract new (...args: any) => infer R

type InstanceType<T extends abstract new (...args: any) => any> = T extends abstract new (...args: any) => infer R ? R : any;
타입스크립트 추론 능력을 믿고 앞과 뒤의 모양을 똑같이 만들어 줌으로써 그 부분의 타입을 찾아내는 방식

 

 

 

 

 

class A {
    a: string;
    b: number;
    c: boolean;

    constructor(a: string, b: number, c: boolean) {
        this.a = a;
        this.b = b;
        this.c = c;
    }
}

const c = new A('123', 456, true);
type C = ConstructorPamrameters<typeof A>; // (typeof 클래스)가 생성자 가져올 경우 사용
type I = InstanceType<typeof A>;

 

 

클래스는 타입으로 바로 사용이 가능하여 I의 타입은 A로 추론됨

const a: A = new A('123', 456, true); // 정확히는 인스턴스(new)

 

 

 

반응형