TypeScript 시작

 

 

Javascript 문법이 강력해지고 규모가 커지면서 코드의 관리가 중요해졌다.

자바스크립트는 객체지향 언어의 개념보다는 동적타입언어, 느슨한타입 언어로써 코드량이 많아짐에 따라 규모가 큰 프로젝트에서는 관리하기가 매우 어렵다.

이를 극복하기위해 타입스크립트가 등장하게 되었고, 타입스크립트는 자바스크립트를 조금 더 관리하기 편하게 객체지향적인 관점에서 작업 할 수 있게 도와준다.

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

​

타입스크립트를 사용하려면 먼저 Node.js가 설치되어야 하며 npm이라는 패키지 인스톨러로 설치가 가능하다.

Node.js가 설치가 되고나면 아래 명령어를 통해 타입스크립트를 설치한다.

npm install -g typescript

설치가 완료되면 커멘드 창에서 tsc를 입력하면 아래처럼 정보를 볼 수 있다.

명령 후 실행 모습

타입스크립트를 개발하기 위해서는 비주얼 스튜디오 코드를 설치하면 사용하기가 쉽니다.

비주얼 스튜디오를 설치하면 기본적인 타입스크립트 언어에 대해서 지원하며 플러그인 같은 확장프로그램을 통해 조금 더 편하게 개발 할 수 있다.

개발모습

 

타입스크립트는 파일 확장자 명칭이 *.ts 끝나며 작업이 완료된 파일을 tsc 대상.ts 을 통해서 컴파일하여 자바스크립트 파일로 만들 수 있다.

 

c.ts파일을 만들어 보았다.

//c.ts파일 내부 모습
var abcd : string = 'hello world';
console.log(abcd);

 

만들어진 파일을 cmd에서 아래단계로 명령어를 입력하여 보자.

tsc c.ts

node c.js

 

컴파일 후 실행 모습

컴파일을 하게 되면 *.js파일이 만들어진다.

타입스크립트는 요즘 유행하는 앵귤러, 리엑트 및 뷰.js 같은 프론트 프레임워크를 대부분 지원하며 앵귤러 같은 경우에는 아에 타입스크립트로 만들도록(버전2부터) 되어 있다.