<타입스크립트 프로그래밍> 2장: 타입스크립트 3,000미터 상공에서 내려다보기

2장: 타입스크립트 3,000미터 상공에서 내려다보기

• 2장: 타입스크립트 3,000미터 상공에서 내려다보기
  • 2-1. 컴파일러
  • 2-2. 타입 시스템
  • 2-3. 타입스크립트 vs. 자바스크립트

2-1. 컴파일러

• 프로그램은 프로그래머가 작성한 다양한 텍스트 파일로 구성되어 있으며, 이를 컴파일러^Compiler라는 특별한 프로그램이 파싱하여 추상 문법 트리^{Abstract Syntax Tree (AST)}라는 자료구조로 변환한다
• 이후 컴파일러는 AST를 다시 바이트코드^bytecode이라는 하위 수준으로 변환하고, 이를 런타임^runtime이라는 다른 프로그램에 입력해 평가하고 결과를 얻는다
• 타입스크립트가 다른 언어와 다른 점은 컴파일러가 코드를 바이트코드 대신 자바스크립트 코드로 변환한다는 점이다
• 타입스크립트 컴파일러는 AST를 만들어 결과 코드를 내놓기 전에 타입 확인 과정을 거친다

1. TYPESCRIPT
  1-1. 타입스크립트 소스 -> 타입스크립트 AST
  1-2. 타입 검사기가 AST 확인 (결과 코드 내놓기 전)
  1-3. (타입 검사 후) 타입스크립트 AST -> 자바스크립트 소스
2. JAVSCRIPT
  2-1. 자바스크립트 소스 -> 자바스크립트 AST
  2-2. AST -> 바이트 코드
  2-3. 런타임이 바이트코드 평가

• 타입스크립트 컴파일러가 타입스크립트 코드를 자바스크립트 코드로 컴파일할 때는 개발자가 사용한 타입을 확인하지 않는다
• 즉, 타입 정보는 애플리케이션에 아무런 영향을 주지 않으며, 단지 타입 확인 과정에만 쓰인다
• 덕분에 개발자가 마음대로 타입을 바꾸고 개선/실험해도 기존의 프로그램이 망가질 염려가 없다

2-2. 타입 시스템

• 타입 시스템은 두 가지로 분류된다

1. 정적: 개발자가 명시적으로 작성하는 타입 시스템

2. 동적: 자동으로 타입이 추론되는 시스템

• 타입스크립트는 두 시스템 모두의 영향을 받았다. 즉, 개발자가 직접 타입을 명시하거나 타입스크립트가 직접 타입을 추론하도록 할 수 있다
• 어노테이션:을 이용하면 명시적으로 타입을 지정할 수 있다
• 어노테이션을 사용하지 않고 (일반 자바스크립트처럼) 사용하면 타입스크립트가 할당된 값에 따라 알아서 타입을 추론한다

// 1. 어노테이션 사용
let a: number = 1; // 'a' 변수는 무조건 숫자 타입의 값을 받는다
let b: string = 'Kyusung Sohn'; // 'b' 변수는 무조건 문자열 타입의 값을 받는다

// 2 어노테이션 미사용
let notTyped = 100;
console.log(typeof notTyped); // --> Number

notTyped = 'James'; // --> Type 'string' is not assignable to type 'Number'

2-3. 타입스크립트 vs. 자바스크립트

타입 시스템 기능	자바스크립트	타입스크립트
타입 결정 방식	동적	정적
타입 자동 변환	O	X (대부분)
타입 확인 시기	런타임	컴파일 타임
에러 검출 시기	런타임 (대부분)	컴파일 타임 (대부분)

 

• 자바스크립트가 동적 타입 바인딩이라는 건 프로그램을 실행해야만 특정 데이터의 타입을 알 수 있음을 의미하지만 타입스크립트는 점진적으로 타입을 확인하는 Gradually Typed 언어다
• 자바스크립트는 약한 타입^{Weakly Typed} 언어이기 때문에 숫자와 배열을 더하는 유효하지 않은 연산을 실행시켜도 다양한 규칙에 의거해 개발자의 의도한 바를 알아내려고 노력해 최상의 결과를 도출한다. 반면 타입스크립트는 유효하지 않은 작업을 발견하는 즉시 불평한다

3 + [1]; // Operator '+' cannot be applied to types 'number' and 'number[]'

• 자바스크립트는 개발자의 의도에 맞춰 변환하려 최대한 노력할 뿐, 거의 대부분의 상황에서 타입이 무엇인지 따지지 않는다. 반면 타입스크립트에서는 컴파일 타임에 코드의 타입을 확인하기 때문에, 코드를 실행시키지 않고도 코드의 에러가 있음을 바로 알 수 있다
• 자바스크립트는 런타임에 예외를 던지거나, 암묵적 형변환을 수행하지만 타입스크립트는 컴파일 타임에 문법 에러와 타입 관련 에러를 모두 검출한다