정답을 맞추긴 했는데, Equal가 어렵습니다 ㅠㅠ

실전 연습으로 익히는 고급 타입스크립트 기술

함수 리턴 타입, 파라미터, Awaited의 활용 - 해답

해결된 질문

작성

309

type GetDetailedWeatherParameters = Parameters<typeof getDetailedWeather>;

type tests = [
  Expect<Equal<GetLocationWeatherReturn, string>>,
  Expect<
    Equal<
      GetDetailedWeatherParameters,
      [
        locationId: string,
        details?:
          | {
              tempUnit?: "C" | "F" | undefined;
              includeForecast?: boolean | undefined;
            }
          | undefined
      ]
    >
  >
];

export type Expect<T extends true> = T;
export type Equal<X, Y> = (<T>() => T extends X ? 1 : 2) extends <
  T
>() => T extends Y ? 1 : 2
  ? true
  : false;

Expect는 말그대로 T가 true면 true를 반환함.

이제 문제는 Equal인데, 딱보고 제네릭 타입을 맞춰주면 되겠다 싶어서 똑같이 맞춰줘서 되긴 했지만 너무 어렵습니다.

Equal을 이해 하고 싶습니다

typescript

답변 1

애프터캠프

지식공유자

안녕하세요 rhkdtjd_12 님!

Equal의 용도는 아시다시피 Type space 내에서 타입 변수간 비교를 하는 용도로 사용되고 있습니다.

이게 조건문이 연속적으로 얽혀있다보니까 코드를 이해하기가 조금 어려운데요.

자세히 풀어서 설명을 드리면, 우선 아래와 같이 반복되는 패턴을 Foo 라는 타입으로 만들었습니다.

type Foo<X> = <T>() => T extends X ? 1 : 2

새로 생성한 타입을 치환시켜보면 아래와 같이 깔끔하게 되는데요.

export type Equal<X, Y> = Foo<X> extends Foo<Y>
    ? true
    : false;

이러면 좀 더 이해하기가 쉬우실까요? 이걸 말로 풀어보면Foo<X> 가 Foo<Y> 타입으로 할당받을 수 있냐?

Yes: true

No: false

이고, Foo<X> , Foo<Y> 의 타입은 결과적으로 1 또는 2인데요.

Foo<X> 의 결과가 1이고, Foo<Y>의 결과가 2라면 Equal<X,Y>의 결과 타입은 false가 되니까 이걸 Expect 에 넣게되면 타입 에러가 발생할 것입니다.

혹시 더 설명이 필요하면 댓글로 남겨주세요 😃

rhkdtjd_12

질문자

와 설명 진짜 지립니다.

뭔가 약간 유레카 같은 느낌이었습니다.

타입 분석 해볼려고

(<T>() => T extends X ? 1 : 2) extends <
  T

화살표 함수의 제네릭의 T가 X에 속하면 1 아니면 2인데 거기에 또 extend T? 이런식으로 한줄씩 읽을려고 하니까 뇌하수체 전두엽에서 이상이 발생 했는데,

저런식으로 타입분석 할 때 중복 되는 부분을 다른 type으로 선언해서 빼가지고 보면 가독성이 엄청 좋고 확실히 무슨 말인지 이해가 빠르다는걸 배우게 되었던 답변이었습니다.

제가 이해 한거를 바탕으로 정리하면
(<T>() => T extends X ? 1 : 2) 를 A라고 두면
<T>() => T extends Y ? 1 : 2 를 B라고 두면

export type Equal<X, Y> = A extends B ? true : false;

이거군요!!!
i god it

인프런 커뮤니티 질문&답변

정답을 맞추긴 했는데, Equal가 어렵습니다 ㅠㅠ