4:00 let c에 할당되는 type이 다르게 나옵니다.

한 입 크기로 잘라먹는 타입스크립트(TypeScript)

분산적인 조건부 타입

해결된 질문

작성

let c: StringNumberSwitch<string | number>

제가 이렇게 작성을 했는데요 선생님의 말씀대로라면 string이 먼저 StringNumberSwitch를 통해서 number 타입이 되고, number타입이 다음으로 들어가서 string 타입이 되어 최종적인 c의 타입은

number | stinrg

이어야 하는 게 맞지 않나요?

저는 사진과 같이 string | number이렇게 나옵니다.

이렇게 순서를 바꿔봐도 똑같이 나옵니다.

typescript

답변 2

효빈 Hyobin

안녕하세요 🙂 정환 강사님이 휴가중이셔서, 제가 대신 답변드립니다.

let c: StringNumberSwitch<string | number>;

이 코드를 보면, StringNumberSwtich<string>, StringNumberSwtich<number>순서로 동작해서 결국 변수 c의 타입은 number | string이 되야 할 것처럼 보이는데요,

아무리 순서를 바꿔봐도 변수 c의 타입이 string | number로 나오는 이유는, 타입스크립트에서 number | string과 string | number는 결국 같은 타입이고, 타입스크립트나 에디터가 타입을 표시할 때 내부적으로 정해진 순서를 따라 표시해주기 때문입니다.

heedda

질문자

감사합니다

인프런 AI 인턴

안녕하세요, 인프런 AI 인턴입니다.

heedda.kollim님이 언급하신 문제는 StringNumberSwitch 제네릭 타입이 사용되는 방식에 관련된 내용입니다. 먼저 StringNumberSwitch 타입이 어떻게 작동하는지 이해하는 것이 중요합니다.

StringNumberSwitch 타입은 다음과 같은 논리를 가집니다:

조건부 타입: type StringNumberSwitch<T> = [T] extends [number] ? string : number;
이는 T가 number에 할당될 수 있는 경우에는 string을 반환하고, 그렇지 않으면 number를 반환합니다.

그러나 주어진 let c: StringNumberSwitch<string | number>;의 경우, TypeScript는 합집합(union) 타입인 string | number에 대해서 타입을 평가하며, 분산(distribution)하지 않습니다. 즉, StringNumberSwitch<string | number>는 전체로 평가되어, 결국 항상 number | string 타입으로 결과가 나옵니다.

이는 TypeScript의 조건부 타입이 합집합 타입에 다르게 작용하기 때문입니다. 각각의 경우 각각 독립적으로 평가되는 대신에 범위 전체가 한 번에 평가됩니다. 그래서 string | number 모두 커버하기 위해 number | string 타입이 지정됩니다.

관련된 다른 설명 자료나 비슷한 예제에 대해 학습하고 싶으시다면 다음 링크들을 참조하시면 도움이 될 것 같습니다:

이 부분을 참고하시어 해당 타입이 어떻게 작동하는지 더 깊게 이해하시기를 권장드립니다. 추가적인 질문이나 상세한 설명이 필요하면 언제든지 문의해 주세요.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

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

4:00 let c에 할당되는 type이 다르게 나옵니다.