Part6_TypeSciprtCompile
이효경
책 읽기

6장 타입스크립트 컴파일

6.1 자바스크립트의 런타임과 타입스크립트의 컴파일

6.1.1. 런타임과 컴파일타임

  • 사람 > 소스코드 > 컴파일 > 기계어 > 기계
  • 런타임: 컴파일이 완료되면 프로그램이 메모리에 적재되어 실행되는 시간

6.1.2. 자바스크립트 런타임

  • 자바스크립트 런타임 구성요소 : 자바스크립트 엔진, 웹API, 콜백큐, 이벤트 루프, 렌더 큐

6.1.3. 타입스크립트의 런타임

  • 컴파일러 : tsc
  • 타입스크립트가 변환되는 건 자바스크립트이기 때문에 저수준 언어가 아니라서 트랜스파일이라고 부르기도 함
  • 다른 소스코드로 변홚되는 것이기 때문에 소스 대 소스 컴파일러라고 지칭하기도 함
  • 타입스크립트 컴파일되어 실행되는 과정
    1. 타입스립트 소스코드를 타입스크립트 AST로 만든다. (tsc)
    2. 타입 검사기가 AST를 확인하여 타입을 확인한다. (tsc)
    3. 타입스크립트 AST를 자바스크립트 소스로 변환한다. (tsc)
    4. 자바스크립트 소스코드를 자바스크립트 AST로 만든다. (런타임)
    5. AST가 바이트 코드로 변환된다. (런타임)
    6. 런타임에서 바이트 코드가 평가되어 프로그램이 실행된다. (런타임)
    • AST : 컴파일러가 소스코드를 해석하는 과정에서 생성된 데이터 구조다.

6.2 타입스크립트 컴파일러의 동작

6.2.1. 코드 검사기로서의 타입스크립트 컴파일러

  • 타입스크립트 컴파일러는 코드에 타입 오류를 확인한다. 정적으로 코드를 분석해서 에러를 검출하며 코드를 실행하기 전에 자바스크립트 런타임에서 발생할 수 있는 에러를 사전에 알려준다.

6.2.2. 코드 변환기로서의 타입스크립트 컴파일러

  • 타입스크립트 컴파일러는 타입을 검사한 다음에 타입스크립트 코드를 각자의 런타임 환경에서 동작할 수 있도록 구버전의 자바스크립트로 트랜스파일한다.
  • 타입스크립트 소스코드는 브라우저와 같은 런타임에서 실행할 수 없다.
  • 바벨 : ECMAScript 2015 이후의 코드를 현재 또는 오래된 브라우저와 호환되는 버전으로 변환해주는 자바스크립트 컴파일러다.

6.3 타입스크립트 컴파일러의 구조

타입스크립 컴파일러의 실행 과정

  • 스캐너 > 파서 > 바인더 > 체커 > 이미터
  • .ts 토큰화 > 토큰 기반 AST 생성 > AST 노드 기반 심볼 생성 > AST+심볼 기반 타입 검사 > AST + 코드 검사 기반 .JS 생성

6.3.1. 프로그램

  • 컴파일러는 tsconfig.json에 명시된 컴파일 옵션을 기반으로 컴파일을 수행함
  • 먼저 전체적으로 컴파일 과정을 관리하는 프로그램 객체가 생성된다. 이 프로그램 객체는 컴파일할 타입스크립트 소스 파일과 소스파일 내에서 임포된 파일을 불러오는데 가장 최초로 불러온 파일을 기준으로 컴파일 과정이 시작된다.

6.3.2. 스캐너

  • 타입스크립트를 자바스크립트로 변환하기 위한 첫번째 단계
  • 타입스크립트 소스 파일을 어휘적으로 분석하여 토큰을 생성하는 역할을 한다.
  • 쉽게 마하면 소스코드를 작은 단위로 나눠 의미있는 토큰으로 변환하는 작업을 수행한다.

6.3.3. 파서

  • 생성된 토큰 목록을 활용하여 구문적 분석을 수행한다.

6.3.4. 바인더

  • 타입 검사를 위해 심볼이라는 데이터 구조를 생성한다. 심볼은 이전 단계의 AST에서 선언된 타입의 노드 정보를 저장한다.

6.3.5. 체커와 이미터

  • 체커는 파서가 생성한 AST와 바인더가 생성한 심볼을 활용하여 타입 검사를 수행한다.
  • 이미터는 타입스크립트 소스 파일을 변환하는 역할을 한다.