더북(TheBook)

자바스크립트에서는 사실 parseInt(1)parseInt('1') 모두 정상적으로 작동합니다. 다만 타입스크립트에서는 parseInt의 인수로 문자열만 넣을 수 있게 제한했습니다. 자바스크립트의 자유도가 제한된 또 다른 사례입니다. parseInt(1)은 어차피 1이니 의미 없는 짓을 하지 말라는 뜻이죠.

따라서 에러가 발생하지 않게 하려면 returnNumber 함수를 다음과 같이 수정해야 합니다.

놀랍게도 타입스크립트가 if문을 인식합니다. if문에서 typeof value === 'number'를 통해 블록 내부 value의 타입이 number라는 것을 알렸습니다. if문 안에 return이 있으므로 if문 바깥에서 value의 타입은 string이 됩니다.

이렇게 유니언 타입으로부터 정확한 타입을 찾아내는 기법을 타입 좁히기(Type Narrowing)라고 부릅니다. 2.2절에서 배운 타입 넓히기와는 반대입니다(다양한 타입 좁히기 기법에 대해서는 2.23절에서 살펴봅니다).

첫 예제에서도 타입 좁히기를 해야만 string이나 number의 속성에 접근할 수 있습니다.

let strOrNum: string | number = 'hello';
strOrNum = 123;

if (typeof strOrNum === 'number') {
  strOrNum.toFixed();
}
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.