자바스크립트의 문제점과 타입스크립트 사용 이유

• 자바스크립트는 존재하지 않는 프로퍼티의 접근을 허용한다.

const obj = { a: 1, b: 2 };
const area = obj.a * obj.v;  // NaN: 1 * undefined

대부분의 프로그래밍 언어들은 컴파일 전에 코드에 오류가 있으면 이를 알려 주고, 코드 실행을 사전에 차단한다. 하지만 자바스크립트는 오류 발생을 코드 실행 전에 알려주지 않기 때문에 런타임에 코드 오류가 발생한다.

만약 area를 다른 곳에서 참조하는데, 그것이 정수 값이라고 생각하고 코드를 작성했다면 런타임에 오류가 발생하게 될 것이다.

• 동일 연산자 ==는 인수를 강제로 변환하여 예기치 않은 동작을 유발한다.

if ("" == 0) {
  // 참입니다!
  // "" => Number("") => 0
}

자바스크립트는 개발자가 예측하지 못한 동작을 유발하기도 한다. 특히 동일 연산자 ==가 그렇다.

따라서 이러한 자바스크립트의 문제점들을 보완하기 위해 타입스크립트를 사용할 수 있다.

TypeScript: 정적 타입 검사자

• 타입스크립트는 자바스크립트를 기반으로 하는, 강력한 타입 기반 프로그래밍 언어이다.
• 간단하게, 타입스크립트는 자바스크립트에 타입을 추가한 언어이다.
• 타입스크립트는 프로그램 실행 전에 값의 종류(타입)에 따라 프로그램의 오류를 찾는다.

구문(Syntax)

• 타입스크립트는 자바스크립트의 구문이 허용되는, 자바스크립트의 상위 집합이다.
  • 타입스크립트는 자바스크립트 구문을 허용한다.
  • 정상 작동하는 자바스크립트 코드를 타입스크립트 파일에 넣어도 잘 작동한다.

타입(Types)

• 타입스크립트는 타입이 있는 상위 집합이다.(자바스크립트의)
• 따라서 자바스크립트 코드를 타입스크립트 코드로 옮기면 타입 오류를 볼 수 있다.

런타임 특성(Runtime Behavior)

• 타입스크립트는 자바스크립트의 런타임 특성을 가진 프로그래밍 언어이다.
• 논리적으로, 타입스크립트는 자바스크립트 코드의 런타임 특성을 절대 변화시키지 않는다.
• 타입 오류를 검출해도 같은 방식으로 실행될 것이 보장된다.

삭제된 타입

• 타입스크립트의 컴파일러가 코드 검사를 마치면 타입이 삭제된 코드가 결과로 나온다.
• 타입스크립트 코드와 달리, 타입스크립트 코드의 컴파일 결과인 자바스크립트 코드에는 타입 정보가 없다.
• 타입 정보가 없는 것은 타입에 따라 프로그램의 특성을 변화시키지 않는다는 의미이다.

정리

• 타입스크립트는 자바스크립트를 기반으로 빌드된 강력한 타입 기반 프로그래밍 언어이다.
• 타입스크립트는 자바스크립트 구문을 허용한다.
• 타입스크립트는 별도의 컴파일 과정을 거치고, 컴파일 과정을 거치면 타입이 삭제된 자바스크립트 코드가 된다.
• 타입스크립트는 컴파일-타임 타입 검사기가 있는 자바스크립트의 런타임이다.

참고

• TypeScript for the New Programmer