[TypeScript] 타입스크립트란 ? vscode에서 개발 환경 설정하기

타입스크립트(TypeScript)란?

• 자바스크립트의 supterset인 오픈소스 프로그래밍 언어.
• 마이크로 소프트에서 개발, 유지 하고 있음
• 엄격한 문법을 지원.
• 자바스크립트 엔진을 사용하여 커다란 애플리케이션을 개발할 수 있게 설계된 언어.
• 모든 운영체제, 모든 부라우저, 모든 호스트에서 사용가능한 오픈 소스
• 자바스크립트의 모든 기능을 포함, 자바스크립트에 포함되지 않는 새로운 기능이 있다.

 

 

 

 

 

왜 타입스크립트를 사용하는가?

• 자바스크립트를 사용할때보다
• 버그를 줄이고 유지보수가 쉽다. 질 좋은 코드를 만들 수 있다.
  
  

 

 

 

 

 

 

특징

1. 변수를 정의할 때 데이터 타입 지정 가능

예측가능하며 디버깅하기 쉽다.

 

2. 객체 지향적이다.

 

3. 컴파일 타임 오류를 잡을 수 있다.

 

 

 

---

 

개발환경 설정하기

1. 준비

vscode,

node js 를 이미 깐 상태여야함

 

 

2. 타입스크립트 컴파일러 설치

타입스크립트를 자바스크립트로 변환해주는 컴파일러임

터미널에서

npm install -g typescript

 

 

3. index.html을 만들어준다.

 

4. app.ts를 만들어준다.

function logName(name: string){
    console.log(name);
}

logName("hyeonju");

 

이렇게 변수 타입을 지정해줄 수 있다.

 

 

 

5. js파일로 컴파일

터미널에서 이렇게 컴파일을 해주면 app.js파일이 저절로 생긴다.

tsc app.ts

 

 

 

6. script로 html파일에 연결

 

 

7. tsconfig파일 만들기

그런데 app.ts로 다시 들어가보면 이렇게 경고가 뜬다.

 

tsconfig.json 파일이 있으면 된다.

tsc --init

 

 

 

8. 자동으로 ts를 컴파일 하기

ts가 변환이 있을때마다 tsc명령어를 사용하여 js파일로 변경하는것은 번거롭다.

tsc -w app.ts

터미널에 이렇게 하면 감시모드로 변환되어

ts파일이 변환되면 저절로 js파일에 변경된다.