# 1. TypeScript
###### tags: `지호`, `TypeScript Essentials`
<br/>
## 1. TypeScript란 무엇인가
### 특징
- 타입을 추가해서 자바스크립트를 확장
- 자바스크립트를 이해함으로써, **코드를 실제로 실행하기 전에** 에러를 잡아줌
- 전통적인 컴파일 언어(c++, java..)와 다르게, 인터프리터 언어인 순수 자바스크립트로 transpile하는 언어
### Typescript Compiler

<br/>
## 2. Typescript 설치 및 사용
### 자바스크립트 실행 환경
- node.js
- 크롬 브라우저의 V8 엔진을 이용하여 자바스크립트를 해석하고 API 제공
- 서버사이드 용
- LTS 버전 설치
- 노드 버전 관리: nvm, n
- browser
- 대표적인 자바스크립트 런타임 환경
- DOM 제어 가능
### 타입스크립트 컴파일러
- 글로벌로 타입스크립트 설치
```shell=
npm i typescript -g # 타입스크립트 설치
node_modules/.bin/tsc # 타입스크립트 실행 폴더
tsc source.ts # 타입스크립트 컴파일러를 실행하여, 해당 파일을 자바스크립트로 변환한 파일이 생성됨
tsc --init # 프로젝트에 타입스크립트 설정 파일인 tsconfig.json 파일 생성
tsc -w # 파일이 수정됐을 때마다 새로 컴파일이 됨 (watch 모드)
```
- 프로젝트에 타입스크립트 설치
```shell=
npm uninstall typescript -g # 글로벌로 설치된 타입스크립트 제거
npm init -y # npm 프로젝트 초기화
npm i typescript # 프로젝트에 타입스크립트 설치 -> node_modules/typescript
npm i typescript -D # 런타임에 필요하지 않기 때문에 devDependency로 추가
npx tsc --init # node_modules/typescript/.bin/tsc 를 이용하여 프로젝트에 tsconfig.json 파일 생성
npx tsc -w # 위와 동일
npm run build # package.json에 script에 "build" : "tsc" 로 수정하면 이 명령어를 사용하여 tsc 실행이 가능하다.
npm run build:watch # 이 명령어도 사용 가능
```
<br/>
## 3. Type Annotation
타입을 지정해준다.
```typescript=
let a: number;
```