[TS] 런타임과 컴파일

런타임과 컴파일타임

• 자바스크립트는 고수준 언어에 속하며 컴파일러나 인터프리터에 의해 기계가 이해할 수 있는 저수준 프로그래밍 언어로 번역되어 실행된다.
• 자바스크립트는 인터프리터 언어지만, 자바스크립트를 해석하고 실행하는 역할을 하는 V8 엔진은 때때로 최적화를 위해 컴파일 단계를 거친다. 이를 통해 코드를 캐싱하여 이후 실행 시간을 단축한다.
• 컴파일타임은 소스코드가 컴파일 과정을 거쳐 컴퓨터가 인식할 수 있는 기계어 코드(바이트 코드)로 변환되어 실행할 수 있는 프로그램이 되는 과정을 의미한다.
• 소스코드의 컴파일이 완료되면 프로그램이 메모리에 적재되어 실행된다. 런타임은 컴파일 과정을 마친 응용 프로그램이 사용자에 의해 실행되는 과정이다.

자바스크립트 런타임

• 자바스크립트 런타임은 자바스크립트가 실행되는 환경을 의미한다. 대표적인 자바스크립트 런타임으로 크롬이나 사파리 같은 인터넷 브라우저와 Node.js 등이 있다.
• 주요 구성 요소로는 자바스크립트 엔진, 웹 API, 콜백 큐, 이벤트 루프, 렌더 큐가 있다.
• 자바스크립트는 애플리케이션이 실행되는 런타임에서 에러가 발생한다.

타입스크립트의 컴파일

• 일반적으로 컴파일은 추상화 단계가 다른 고수준 언어에서 저수준 언어로 변환되는 과정을 말한다. 하지만 타입스크립트는 tsc라고 불리는 컴파일러를 통해 고수준 언어인 자바스크립트 코드로 변환된다.
• 즉, 고수준 언어가 또 다른 고수준 언어로 변환되는 것이다. 이로 인해 컴파일이 아닌 트랜스파일이라고 부르기도 한다. 또한, 타입스크립트 컴파일러를 소스 대 소스 컴파일러라고 지칭하기도 한다.
• 트랜스파일의 또 다른 예시로 ES6 버전 이상의 문법을 ES5 버전 이하의 문법으로 변환하는 바벨(Babel) 등이 있다.
• 타입스크립트 컴파일러는 소스코드를 해석하여 AST를 만들고 이후 타입 확인을 거친 다음에 결과 코드를 생성한다.
• AST(Abstract Syntax Tree)는 컴파일러가 소스코드를 해석하는 과정에서 생성된 데이터 구조다. 컴파일러는 어휘적 분석과 구문 분석을 통해 소스코드를 노드 단위의 트리 구조로 구성한다.
• 타입 정보는 단지 타입을 확인하는 데만 쓰이고 최종적으로 만들어지는 프로그램에는 아무런 영향을 주지 않는다.
• 타입스크립트는 컴파일 타임에 타입을 검사하기 때문에 에러가 발생하면 프로그램이 실행되지 않는다. 이러한 특징 때문에 타임스크립트를 컴파일타임에 에러를 발견할 수 있는 정적 타입 검사기라고 부른다.

타입스크립트 컴파일 과정

1. 타입스크립트 소스코드를 타입스크립트 AST로 만든다. (tsc)
2. 타입 검사기가 AST를 확인하여 타입을 확인한다. (tsc)
3. 타입스크립트 AST를 자바스크립트 소스로 변환한다. (tsc)
4. 자바스크립트 소스코드를 자바스크립트 AST로 만든다. (런타임)
5. AST가 바이트 코드로 변환된다. (런타임)
6. 런타임에서 바이트 코드가 평가되어 프로그램이 실행된다. (런타임)

타입은 1 ~ 2단계에서만 사용된다. 3단계부터는 타입을 확인하지 않는다.

코드 검사기 역할

• 타입스크립트는 정적으로 코드를 분석하여 에러를 검출하며, 코드를 실행하기 전에 자바스크립트 런타임에서 발생할 수 있는 에러를 사전에 알려준다. 즉, 컴파일타임에 문법 에러와 타입 관련 에러를 모두 검출할 수 있다.
• 객체에 해당 메서드가 없다는 것을 컴파일타임에 알려준다.

const developer = {
  work() {
    console.log('work!');
  },
};

developer.break(); // 에러 발생

• 타입스크립트 컴파일러는 tsc binder를 사용하여 타입 검사를 수행한다.

코드 변환기 역할

• 타임스크립트 소스코드는 브라우저 등의 런타임에서 바로 실행될 수 없다. 따라서 타임스크립트 컴파일러는 코드를 각자의 런타임 환경에서 동작할 수 있도록 구버전의 자바스크립트로 트랜스파일한다.
• 타입스크립트 컴파일러의 target 옵션을 사용하여 특정 버전의 자바스크립트 소스코드로 트랜스파일할 수 있다. ES5 등으로 지정할 수 있다.
• 타입스크립트 코드가 자바스크립트 코드로 변환되는 과정은 타입 검사와 독립적으로 동작한다. 따라서 타입 오류가 있더라도 컴파일은 진행된다. 타입 에러는 자바스크립트 실행 과정에서 런타임 에러로 처리된다.