TypeScript은 JavaScript랑 뭐가 다를까?

TypeScript란?

타입스크립트는 자바스크립트의 슈퍼셋이다. JavaScript 기능 + TypeCheck 기능을 추가해서 자바스크립트의 모든 단점을 보완해 만든 언어이다.

JavaScript는 같이 협업하는 사람이나 혹은 다른 사람이 코드를 읽을 경우 타입이 어떤 것인지 짐작하기가 어렵다. 또한, 실행 중에 버그를 찾기 때문에 테스트 때 미처 발견하지 못한 에러가 운영 중에 발견될 수도 있다.

TypeScript는 타입을 명시하고 컴파일 중에 오류를 찾기 때문에 보다 더 안정적이다. 또한, 타입 정보를 포함하고 있어서 IDE에서 코드 자동 완성, 디버깅, 리팩토링 등의 기능이 지원된다.

Static typing

JavaScript는 변수와 함수의 타입을 지정하지 않는 동적 타이핑을 사용하기 때문에 코드의 가독성이 떨어지고, 런타임 환경에서만 오류를 발견할 수 있어 디버깅이 어렵다.

TypeScript는 이러한 문제점을 해결하기 위해서 정적 타이핑을 지원하며, 코드 작성 시 변수와 함수의 타입을 지정하도록 한다. 이를 통해 코드 내부에서 발생할 수 있는 오류를 사전에 방지하거나 찾아내는 것이 가능하다.

따라서 TypeScript를 사용하면 알맞지 않은 타입을 넣거나, 타입을 지정하지 않았을 경우 IDE에서 오류로 경고해주기 때문에 더 안정적이고 가독성이 좋은 코드를 작성할 수 있다.

Compiler

JavaScript는 인터프리터 언어로 소스 코드를 한 줄씩 읽으며 즉시 실행하는 방식으로 동작한다. 실행 중에 오류가 발생하면 해당 오류를 즉시 보고한다.

TypeScript는 컴파일러 언어로 소스 코드가 컴파일러에 의해 자바스크립트 코드로 변환되어 자바스크립트 엔진에서 실행된다. 코드를 변환하면서 타입 검사와 코드 최적화 작업을 수행하고, 변환된 코드가 실행될 때 오류를 찾는다.

Superset

타입스크립트는 자바스크립트의 슈퍼셋, 자바스크립트의 +α이다. ECMAScript(JavaScript)의 최신 버전을 지원하면서, 더 많은 기능을 추가하여 개발자가 더욱 높은 생산성을 가질 수 있도록 설계되었다.

1. Interface Extension - 인터페이스를 상속받아 새로운 인터페이스를 생성할 수 있다. 이를 통해 코드 중복을 줄이고 유지보수성을 높일 수 있다.

2. Mixin - 클래스에서 다중 상속을 지원하는 기능이다. 클래스 간 코드 중복을 줄이고 재사용성을 높일 수 있다.

3. Decorator - 클래스, 메서드, 프로퍼티 등에 추가로 기능을 부여할 수 있는 기능이다. 예를 들어, 로그를 남기거나 성능을 측정하는 등의 기능을 데코레이터를 통해 쉽게 추가할 수 있다.

4. Type Alias - 복잡한 타입을 간략하게 표현할 수 있는 기능이다. 예를 들어, 문자열과 숫자의 조합으로 이루어진 튜플(Tuple) 타입을 간략하게 표현할 수 있다.

5. Enum - 관련된 상수들을 그룹화하여 표현할 수 있는 기능이다. 이를 통해 가독성을 높일 수 있다.