[Typescript] 1. Typescript는 어따쓰는가?

1. 왜 타입스크립트는 태어났는가?

자바스크립트는 태생부터 문제가 많은 친구이다. 프로그래밍 언어가 완벽한 상태로 태어날 수 없지만, 자바스크립트는 과거 웹페이지의 보조적인 기능을 수행하기 위해 태어난 언어이다. 다른 언어에 비해 잘 정제되어있지 않은 상태로 출시되었다. 이러한 태생적 한계를 극복하고자 Typescript가 탄생했다.

2. 그럼 다른 언어는 완벽해?

자바스크립트는 C언어나 Java와 같은 C-family 언어와는 구별되는 특성들을 가지고있다.

• Prototype-based Object Oriented Language
• Scope / this
• 동적 타입 언어(느슨한 타입 언어)

이러한 자바스크립트의 특성은 기존의 클래스 기반 객체지향 언어에 익숙한 개발자를 혼란스럽게 하며 코드가 복잡해지고 디버깅과 테스트 공수가 증가하는 등 다양한 문제를 일으킬 수 있는 가능성이 있다.

3. 그래서 타입스크립트가 뭔가?

Typescript 또한 Javascript 대체 언어 중 하나로써 자바스크립트의 Superset(상위확장)이다. Typescript는 Microsoft에서 2012년 발표한 오픈소스로, 정적 타이핑을 지원하며 ES6의 클래스, 모듈 등과 ES7의 Decorator 등을 지원한다.

Typescript는 ES5의 Superset이므로 기존의 Javascript문법을 그대로 사용할 수 있다. 또한, ES6의 새로운 기능들을 사용하기 위해 Babel과 같은 별도 트랜스파일러를 사용하지 않아도 ES6의 새로운 기능을 기존의 자바스크립트 엔진에서 실행할 수 있다.

4. Typescript의 장점

1) 정적 타입

개인적으로 동적 타이핑과 정적 타이핑을 '유동적인가?, 제한적인가?'로 이해했다. 아래의 코드에서 sum 함수의 인자로 다양한 타입을 유동적으로 대입했을 때 정상적으로 작동하면 동적 타이핑, 미리 정해준 타입으로만 인자를 대입해야 정상적으로 작동하면 정적 타이핑으로 이해했다.

//------Javascript 환경------

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

sum(1,2);  // 기존의 자바스크립트의 동적 타이핑으로 전혀 문제가 없는 코드이다.


//-------Typescript 환경-----

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

sum(1,2);  // 결과값으로 3을 정상적으로 불러온다.
sum('x','y');  // 해당 코드는 위에서 지정한 number 타입과 맞지않은 string 타입이기 때문에 에러를 불러온다.

Typescript는 정적 타입을 지원하므로 컴파일 단계에서 오류를 포작할 수 있는 장점이 있다. 명시적인 정적 타입 지정은 개발자의 의도를 명확하게 코드로 기술할 수 있다. 코드의 가독성을 높이고 예측할 수 있게 하며 디버깅을 쉽게 한다.

2) 도구의 지원

Typescript를 사용하는 이유는 여러가지 있지만 가장 큰 장점은 IDE(통합개발환경)를 포함한 다양한 도구의 지원을 받을 수 있다는 것이다. (IDE는 기본적으로 우리가 사용하는 VSCode, 이클립스 등을 말한다.) IDE와 같은 도구에 타입 정보를 제공함으로써 수준 높은 수준의 인텔리센스, 코드 어시스트, 타입 체크, 리팩토링 등을 지원받을 수 있으며 이러한 도구의 지원은 대규모 프로젝트를 위한 필수 요소이다.

3) ES6 / ES Next 지원

TypeScript는 아직 ECMAScript 표준에 포함되지는 않았지만 표준화가 유력한 스펙을 선제적으로 도입하므로 새로운 스펙의 유용한 기능을 안전하게 도입하기에 유리하다.

4) Angular

Angular는 Typescript 기반으로 만들어진 프레임워크이다. Angular를 사용한다면 Typescript와 관련된 레퍼런스가 많다.