12강의 주제는 타입 추론!
1. 타입 추론 소개
타입추론이란 타입스크립트가 해당 코드를 어떤식으로 해석하는지에 대한 동작을 뜻한다.
a라는 변수는 타입을 정의하지 않아서 any로 지정되어있다.
사실 정리할때는 저렇게 적었는데 지금와서 제대로 해석해보자면 a라는 변수는 타입을 지정하지 않았고 값을 할당하지도 않은 상태이기때문에 기본적으로 any라는 타입이 지정되어 있다고 설명하는 것이 더 옳을 것 같다.
이후에 a라는 변수에 10을 할당하면 10에 해당하는 타입인 number가 지정된 것을 확인할 수 있다.
첫번째의 경우처럼 VS코드 상에서 코드를 작성했을 때 그 코드의 타입이 무엇인지 TS가 정의해 나가는 방식이 타입추론이다.
기본적인 변수의 선언과 할당에 의해서 타입이 가볍게 추론이 된다는 것을 볼 수 있고 다음의 모든 과정이 타입 추론이 일어나는 과정이라고 볼 수 있다.
문자열과 숫자를 더한 값을 return하면 그 return값이 string의 타입이 될 것이다 라는 것까지 타입스크립트는 내부적으로 추론이 가능하다.
2. 인터페이스와 제네릭을 이용한 타입 추론 방식
조금 더 복잡한 코드에서는 TS가 어떻게 타입을 추론하는지 확인해보자!
인터페이스로 타입을 지정하고 해당 타입을 제네릭으로 넘겨주면 TS의 추론에 의해 자연스럽게 value라는 property의 타입까지 추론하는 것을 확인할 수 있다.
기본적인 인터페이스에 제네릭을 정의했을 때 이 제네릭의 값을 타입스크립트 내부적으로 추론해서 그 변수에 필요한 속성들의 타입까지 같이 보장해준다는게 TS의 추론의 기본적이 방식이다.
3. 복잡한 구조에서의 타입 추론 방식
다음의 코드를 간단하게 설명하자면 두가지 인터페이스를 정의한 것이다. 해석해보면 DetailedDropDown 인터페이스는 DropDown 인터페이스를 상속받는다. 그리고 K라는 제네릭을 호출시점에 받도록 되어있고 해당 K라는 제네릭을 tag라는 프로퍼티와 DropDown의 제네릭으로도 넘겨준다.
이후에 detailedItem이라는 변수의 타입으로 DetailedDrooDown을 지정하고
DetailedDropDown에 제네릭으로 string을 넘기니 저렇게 extends된 DropDown의 속성인 value도 해당 값을 받아오는 것을 확인할 수 있다.
이것을 순서대로 표시해보자면(본인의 뇌피셜!) 다음과 같은 순서가 된다.
그리고 detailedItem이라는 객체의 프로퍼티를 호출시점의 제네릭인 string 타입이 되도록 작성하면 다음과 같은 코드가 된다.
만약 제네릭이 string이 아닌 number로 바꾸게 되면 제네릭의 영향을 받는 value와 tag 속성까지 변동이 생긴다.
4. Best Common Type(가장 적절한 타입) 추론 방식
Best Common Type은 타입스크립트가 해당 코드를 어떤 타입인지 매겨나가는 알고리즘, 해석하는지에 대한 방식이다.
이 코드를 다음과 같이 바꾸면
그 타입들을 배열에 있는 값들 혹은 타입들의 교집합이 될 수 있는 유니언 타입으로 TS가 내부적으로 타입 추론을 하게 되는데 이러한 방식을 Best Common Type이라고 볼 수 있다.
