타입스크립트(TypeScript)란?

TypeScript

 

JavaScript에 타입을 부여한 언어로 JavaScript의 확장된 언어이다. Microsoft에 의해서 개발 및 관리되고 있는 오픈소스 프로그래밍 언어로 대규모 애플리케이션을 개발하는데 JavaScript가 어렵고 불편하다는 불만에 대응하기 위해서 개발되었다. JavaScript는 C, Java와 같은 언어와 구별되는 특성이 있다.

 

• Prototype-based Object Oriented Language
• Scope & this
• 동적 타입(dynamic typed)언어 혹은 느슨한 타입(loosely typed)언어

 

이와 같은 특성은 클래스 기반 객체지향 언어에 익숙한 개발자를 혼란스럽게 하며 코드가 복잡해질 수 있고 디버그가 증가하는 문제를 일으킬 수 있어서 규모가 큰 프로젝트에서는 주의해야 한다.

5 - 3 // 2

// JavaScript는 Dynamic Typing이 가능한 언어이기 때문에 문자를 숫자로 자동 바꿈해준다.
// JavaScript가 동적으로 바꿔준다는 점은 편리하지만 규모가 큰 프로젝트에서는 단점일 뿐이다.
5 - '3'

 

TypeScript는 ES5의 Superset(상위확장)이므로 기존의 JavaScript(ES5) 문법을 그대로 사용할 수 있고 ES6의 새로운 기능들을 사용하기 위해서 Babel과 같은 별도 트랜스파일러를 사용하지 않아도 ES6의 새로운 기능을 기존의 자바스크립트 엔진에서 실행할 수 있다. 즉, JavaScript와 호환이 되는 것은 물론 클래스, 인터페이스 등 객체지향 프로그래밍 패턴을 제공한다. JavaScript의 단점은 줄이고 더 좋은 기능을 감싼 형태로 볼 수 있다.

 

---

 

TypeScript 장점

 

1. 정적 타입 - 에러 사전 방지, 안정성, 협업용이성

function sum(a, b) {
	return a + b;
}

 

위 함수의 의도는 두 개의 숫자 타입 인자를 전달받아서 합을 반환하는 것이다. 하지만 코드 상 어떤 타입의 인자를 전달해야 하는지, 어떤 타입의 반환값을 반환해야 하는지 명확하지 않다. JavaScript는 아래와 같이 작성할 경우 다른 사람이 코드를 읽을 때 타입을 짐작하기 어렵다. 따라서 아래와 같은 결과가 반환될 수 있다.

function sum(a, b) {
	return a + b;
}

sum('10', '20'); // 1020 : Unwanted Behavior at Runtime

 

위 코드는 Runtime Error가 발생하지는 않겠지만 논리적 실수가 있다. JavaScript 에서는 완화 전략으로 if check을 추가하여 Runtime에 입력 타입을 검사할 수 있으며 사용자 입력을 검증하고 삭제할 수도 있다. JavaScript로 이 작업을 수행해도 좋겠지만 개발 도중에 이와 같은 에러를 포착할 수 있다면 얼마나 좋을까?

 

JavaScript에서 위와 같은 상황이 발생한 이유는 동적 타입 언어 특성에 따라서  매개변수와 반환값의 타입을 사전에 지정하지 않았기 때문이다. 이를 TypeScript의 정적 언어로 다시 작성하면 아래와 같다.

function sum(a: number, b: number) {
	return a + b;
}

sum('10', '20'); // ERROR : 10 형식의 인수는 'number' 형식의 매개 변수에 할당될 수 없다.

 

TypeScript는 정적 타입 언어이기 때문에 컴파일 단계에서 오류를 포착할 수 있는 장점이 있다(에러메세지 퀄리티가 높다). 명시적인 정적 타입 지정은 개발자 의도를 명확하게 코드로 기술할 수 있게 한다. 이는 코드의 가독성을 높이고 컴파일 시 오류를 찾기 때문에 보다 안정적이고, 예측할 수 있게 하며 디버깅을 쉽게 한다.

 

2. 실행 속도

 

자바스크립트는 동적 타입의 인터프리티 언어이다. 이 말은 런타임 시 타입을 결정해서 적용되는 것인데, 이는 오류가 있는지 확인하는 작업이 추가되기 때문에 실행 속도가 오래 걸린다. 하지만 TypeScript는 코드 작성을 할 때 타입을 미리 결정하기 때문에 런타임 때 작업을 줄여서 실행 속도가 빠르다는 장점이 있다.

 

---

 

TypeScript 특징

 

브라우저와 같은 JavaScript 환경에서 실행할 수 없는 도구, 언어.

 

JavaScript를 실행할 수 있는 환경에서는 TypeScript가 지원되지 않는다. 즉, 브라우저는 TypeScript를 실행할 수 없으며 node.js 또한 TypeScript를 실행할 수 없다. TypeScript는 프로그래밍 언어이면서 도구이다. 코드를 실행해서 TypeScript 코드를 JavaScript로 컴파일하는 강력한 컴파일러이며, 새로운 기능과 장점을 모두 갖춘 TypeScript 코드를 작성하여 일반적인 JavaScript 코드를 얻을 수 있다. 

 

---