TS와 JS의 집합관계
타입스크립트는 자바스크립트이 상위 집합(superset)입니다.
자바스크립트는 타입스크립트의 부분 집합(subset)입니다.
모든 자바스크립트 프로그램은 타입스크립트입니다.
하지만 모든 타입스크립트 프로그램은 자바스크립트가 아닙니다.
자바스크립트가 아닌 타입스크립트 프로그램이 존재합니다.
이는 타입스크립트가 타입을 명시하는 등의 추가적인 문법을 가지기 때문입니다.
타입 구문을 사용하게 되는 순간, 자바스크립트에서 타입스크립트의 영역으로 변환됩니다.
타입스크립트를 정적 타입 시스템이라고 하는 이유는 타입 시스템의 목표 중 하나가 런타임에 오류를 발생시킬 코드를 미리 찾아내는 것이기 때문입니다.
타입스크립트 컴파일러는 타입 구문을 추가하지 않아도 변수의 초깃값으로부터 타입을 자동으로 추론합니다. 또한 타입 구문과 관계 없이 개발자 의도와 다른 오류를 찾아내고 꽤 훌륭한 해결책을 제시합니다.
하지만 타입 구문을 추가한다면, 훨씬 더 정확하고 많은 오류를 찾아낼 수 있습니다. 왜냐하면 코드의 의도와 목적이 무엇인지 타입 구문을 통해 타입스크립트에게 명확하게 알려줄 수 있기 때문입니다.
위 다이어그램에서 '타입 체커 통과 TS'가 우리가 평소에 작성하는 타입스크립트 코드입니다. 로컬에서 타입 체크 에러를 해결해가면서 코드를 작성하기 때문입니다.
타입 시스템은 자바스크립트의 런타임 동작을 모델링합니다. 따라서 런타임 오류를 발생시키는 코드를 찾아내려고 합니다. 하지만 타입 체커는 런타임 오류를 정상으로 인식하거나, 정상 코드를 오류로 인식할 수도 있습니다.
이러한 오류가 발생하는 근본적인 원인은 타입스크립트가 이해하는 값의 타입과 실제 값에 차이가 있기 때문입니다. 결국 타입스크립트는 정적 타입의 정확성을 보장해주지 않고 애초에 그런 목적으로 만들어지지 않았습니다.
주요 TS 설정
noImplicitAny
inplicit 암시적인, 암묵적으로 합의된
explicit 명시적인, 명확하게 지정된
변수에 아무런 타입도 명시해주지 않으면 타입스크립트는 any로 추론합니다.
하지만 모든 변수가 any로 사용되면, 타입 체커는 무의미해집니다.
따라서 이 설정은 특정 타입을 명시해달라는 뜻입니다.
자바스크립트에서 타입스크립트로 마이그레이션하는 중이 아니라면, 설정하는 것이 좋습니다.
strictNullChecks
모든 타입에서 null과 undefined를 할당할 수 없게 해서, 꼭 필요한 경우에는 명시해서 사용하라는 뜻입니다.
따라서 다른 타입에 null과 undefined가 전달될 경우, 에러가 발생합니다.
'undefinded는 객체가 아닙니다.' 같은 런타임 오류를 예방하기 위해서는 설정하는 것이 좋습니다.
TS Compiler
TS Compiler는 크게 2가지 역할을 수행합니다.
최신 TS/JS 코드를 구형 브라우저에서 동작할 수 있도록 구버전 JS로 transpile합니다.
코드의 타입 오류를 체크합니다.
트랜스파일은 translate(번역)와 compile(컴파일)을 합친 말로, 소스 코드를 동일한 동작을 하는 다른 버전 또는 다른 언어의 소스 코드로 변환하는 것을 의미합니다. 트랜스파일링의 결과물은 여전히 컴파일이 필요한 소스코드(e.g. JavaScript)이기 때문에, 컴파일과 구분해서 부릅니다.
컴파일은 소스 코드를 동일한 동작을 하는 다른 언어로 변환해주는 것을 의미하지만, 컴파일링의 결과물은 컴퓨터가 바로 실행할 수 있는 이진 코드 또는 기계 코드입니다.
위 두 가지 역할은 서로 독립적으로 동작합니다.
따라서 타입 오류가 있는 코드도 컴파일이 됩니다. 이를 통해 애플리케이션 개발 중에 타입 에러 때문에 테스트를 중단할 필요가 없습니다.
그리고 런타임에는 타입 체크가 불가능합니다. 타입스크립트의 타입들은 제거 가능(erasable)하기 때문에, TS에서 JS로 컴파일되는 과정에서 모든 interface, type, 타입 구문은 제거됩니다.
런타임에는 타입 연산이 영향을 주지 않습니다. 이 또한 컴파일 과정에서 타입 구문이 제거되기 때문입니다. 연산이 필요하면, 자바스크립트 연산을 통해 타입 변환을 수행해야 합니다.
참조링크
이펙티브 타입스크립트
mdn Compile
