이 글은 이펙티브 타입스크립트 (댄 밴더캄 저, 장원호 옮김) 를 읽고 개인적으로 정리한 글입니다.

타입스크립트와 자바스크립트

보통 자바스크립트의 변형으로 타입스크립트를 들어본 적이 많을 것이다. 타입스크립트와 자바스크립트는 밀접한 관계에 있기 때문에 어떻게 연관되어 있는지 아는 것이 중요하다.

타입스크립트는 자바스크립트의 상위 집합

타입스크립트는 자바스크립트의 구문이 허용되는 자바스크립트의 상위 집합의 언어이다. 즉, 자바스크립트의 문법을 기초하여 추가적인 기능을 하는 것이다.

여기서 타입스크립트의 추가적인 기능은 자바스크립트에 정적 타입 체킹이라는 기능이다. 자바스크립트 코드에 정적 타입 오류를 검증하여 더 안정적인 프로그램을 만들 수 있도록 도와준다.

또한 자바스크립트 코드가 문법적으로 문제가 없다면 타입스크립트 컴파일러는 작성된 자바스크립트 코드를 파싱하고 변환할 수 있다. 보통 자바스크립트 코드는 .js 확장자를 가지는 반면 타입스크립트 코드는 .ts 확장자를 가지는데 타입스크립트는 자바스크립트의 상위 집합이므로 .js 의 자바스크립트 파일은 .ts 로 바꾸더라도 문제없이 동작한다. 이 점은 자바스크립트 코드를 타입스크립트로 마이그레이션하는데 큰 도움을 준다.

타입스크립트의 타입 체커

타입스크립트에는 자바스크립트와는 달리 타입을 명시하는 추가적인 문법이 존재한다.

const nickname: string = 'seoul';

위와 같이 변수명 옆에 : 로 구분하여 nickname 변수가 문자열임을 정의할 수 있다. 이렇게 타입 구문을 사용하는 순간 자바스크립트가 아닌 타입스크립트를 사용하는 것이라고 할 수 있다.

타입시스템의 가장 큰 목적은 런타임에 발생할 오류를 컴파일 타임에 미리 찾아 발생할 수 있는 오류를 미연에 방지하는 것이다. 타입스크립트가 정적 타입 검사기라는 것은 이런 특징을 의미하는 것이다.

참고로 타입스크립트 컴파일러는 코드 정적 검사를 모두 마치면 타입을 삭제하여 타입스크립트 파일을 자바스크립트로 컴파일한다. 즉, 타입스크립트에서 컴파일된 자바스크립트 코드는 타입 정보가 없다. 런타임에는 타입스크립트의 요소가 존재하지 않기 때문에 기존의 자바스크립트 런타임 라이브러리를 그대로 사용할 수 있다.

참고

이펙티브 타입스크립트 (댄 밴더캄 저, 장원호 옮김) item 1: http://www.kyobobook.co.kr/product/detailViewKor.laf?mallGb=KOR&ejkGb=KOR&barcode=9788966263134

Typescript for the New Programmer: https://www.typescriptlang.org/docs/handbook/typescript-from-scratch.html