[TS] 타입스크립트는 무엇인가?

🧐 타입스크립트란?

• JS의 모든 기능을 포함하면서 정적 타입을 지원하는 언어
• JS의 슈퍼셋인 오픈소스 프로그래밍 언어 (어떤 브라우저, 호스트, 운영체제에서도 동작함)
• 인터프리터 언어인 JS와 다르게 컴파일 언어
  • 인터프리터 언어: 소스 코드를 한 줄 씩 읽어가며 명령을 처리. 번역과 실행이 동시에 이루어짐
  • 컴파일 언어: 소스코드를 한 번에 번역한 후, 한 번에 실행함 (번역과 실행이 따로 이루어짐)
  • TS를 JS로 변환하는 것 역시 이러한 컴파일 과정에 속한다고 볼 수도 있음
  • 하지만 엄밀히 말하면 TS는 트랜스파일 언어!

🛠️ 트랜스파일 언어

• 한 언어로 작성된 소스코드를 비슷한 수준의 추상화를 가진 다른 언어로 변환하는 것

컴파일의 슈퍼셋!

• 컴파일 동작 중 추상화 정도가 유사한 언어끼리의 컴파일 과정을 트랜스파일이라고 부름
• 예: Babel
  • IE 호환성을 위해 높은 버전의 JS 코드를 낮은 버전의 JS 코드로 변환
• TS 코드를 JS로 컴파일 하는 것 역시 여기에 속함
  • 코드의 안정성 및 유지보수성의 측면에서 TS가 추상화 수준이 더 높아보일 수도 있지만, 기본적인 문법 및 구문은 JS와 매우 유사하므로 추상화 수준이 JS와 비슷하다고 봄

🔋 TS의 장점

🌟 에러를 예방할 수 있다!

• 컴파일러가 코드를 검사할 때 코드에 대한 경고 및 오류를 검출해내므로 런타임 시 버그 발생 확률이 줄어듦
• 동적인 JS 코드에 타입을 미리 부여함으로써 컴파일 시 에러를 미리 검출 가능
• JS로 개발할 때에는 콘솔에 찍어서 확인했어야 하는 정보들을 미리 파악할 수 있으므로, 에러 사전 방지가 가능

🌟 타입의 안정성이 보장된다!

• JS는 동적 타입 언어이므로 타입 안정성이 보장되지 않음
• TS는 JS의 타입을 확장하고, type annotation을 이용해 변수에 대한 타입 선언을 가능케함
• 이를 통해 변수에 엄격한 타이핑이 적용되어 타입의 안정성 확보

🌟 JS로의 코드 이동이 편리하다!

• JS의 슈퍼셋으로서 ECMA Script의 최신 표준을 지원함
• 즉, ES6의 새로운 기능을 적용하기 위해 Babel과 같은 별도 transpiler 적용 필요 X
• TS → 컴파일 → JS → 실행
• tsConfig 파일을 통해 JS 파일 변환 시 경로, 버전 등을 임의로 설정 가능

🌟 협업에 용이하고, DX 개선에 좋다!

• 타입을 미리 지정함으로써 코드의 문서화가 가능해지므로, 추후 다른 개발자들이 코드를 이해하기에 편리함
• TS에서는 변수의 타입을 이미 알고 있으므로, 코드 자동 완성 및 가이드가 가능해짐