1. 타입스크립트 컴파일러

타입스크립트는 자바스크립트나 자바와 같은 언어와는 다르게 동작됩니다. 같은 프로그래밍 언어가 아닌가?라는 의문을 가질 수 있습니다. 이에 대해 간단하게 살펴보겠습니다.

1.1 자바스크립트가 실행되는 과정

프로그램이란 프로그래머가 작성한 텍스트(코드) 파일들로 이루어져 있습니다. 그리고 이 텍스트들을 특별한 프로그램이 해석하여 새로운 형태로 변환하게 됩니다. 여기서 특별한 프로그램을 컴파일러라고 부릅니다.

컴파일러는 텍스트를 해석하여 소스코드의 구성을 나타내는 새로운 형태로 만듭니다. 이 자료구조를 추상 문법 트리(Abstract Syntax Tree), 줄여서 AST라고 부릅니다.

AST는 주석이나 공백 탭 등을 완전히 무시합니다. 그리고 이렇게 만들어진 AST를 컴퓨터에서 실행할 수 있도록 바이트코드로 바꿔줍니다. 내 코드를 가지고 컴퓨터가 실행할 수 있도록 바꾼 것이라 볼 수 있습니다. 이 두 개의 과정을 우리는 컴파일이라고 부릅니다.

마지막으로 컴파일의 결과물을 컴퓨터가 실행하게 됩니다. 이 부분에서 프로그램 또는 과정을 런타임(Run-Time)이라고 부릅니다. 이러한 단계를 순서로 요약하면 아래와 같습니다.

프로그램 코드를 작성한다.
컴파일러가 컴파일을 진행한다.
컴파일 결과물을 컴퓨터가 실행한다.(런타임)

자바스크립트는 보통 2단계와 3단계를 합쳐서 실행됩니다. 런타임과 컴파일이 합쳐져 있다는 의미입니다. 즉, 우리가 브라우저에서 개발자도구를 열고 한 줄씩 실행할 때 결과를 바로 확인할 수 있는 이유가 여기 있습니다. 한 줄, 한 줄을 입력할 때마다 해석에서 실행까지의 과정을 진행합니다.

1.2 타입스크립트가 실행되는 과정

타입스크립트는 이러한 동작 방식이 아닙니다. 보통의 프로그래밍 언어는 "컴파일 후 바이트코드 → 실행"의 과정을 가지게 된다는 것을 알게 되었습니다. 타입스크립트는 이러한 과정과는 다르게 컴파일러가 코드를 바이트코드가 아닌 자바스크립트 코드로 변환한다는 것에 있습니다. 우리는 이 결과물(자바스크립트 코드)을 브라우저 또는 Node.js에서 실행하게 되는 것입니다.

타입스크립트의 컴파일 과정은 다음과 같습니다.

타입스크립트 코드를 타입스크립트 AST로 변환
타입스크립트 AST를 타입검사기를 통해 타입 유효성 검사
타입스크립트 AST를 자바스크립트로 변환

여기서 타입검사기라는 부분이 보이네요. 타입검사기는 코드에서 타입이 알맞게 사용되었는지, 즉, 실행하는데 안전한지를 확인해주는 프로그램입니다. 타입스크립트는 해당 과정을 통해 앞서 플레이 그라운드에서 우리가 볼 수 있었던 오류와 같은 부분들을 컴파일 과정 또는 개발자 도구에서 미리 확인할 수 있게 됩니다.

그리고 만들어진 자바스크립트 코드는 일반 자바스크립트와 똑같이 동작됩니다.

타입스크립트 베이스캠프

타입스크립트 동작 방식