TypeScript를 시작하다.
1. 타입스크립트에 들어가기
자바스크립트 변수에 타입 값을 지정하여 오류를 줄여주는 타입스크립트를 배우려고 한다.
타입스크립트는 자바스크립트 변수에 타입을 지정하는 문법을 추가해서 작성한다. 브라우저와 노드는 모두 자바스크립트 코드만 읽을 수 있기 때문에 우리가 타입스크립트로 코드를 작성해도 타입스크립트 내부의 tsc라는 것이 작성한 코드에 타입의 이상은 없는지 확인하면서 타입스크립트 코드를 자바스크립트 코드로 변경한다. 여기서 타입에 이상이 있든 없든 tsc는 타입스크립트 코드를 자바스크립트 코드로 변경한다는 것이다. 타입 검사에 실패하여도 변환은 된다.
타입을 지정하는 코드만 추가로 작성한다는 것을 반대로 생각하면 타입 지정 문법만 지워주면 자바스크립트 코드로 정상 작동해야 한다라는 결론이 나온다.
2. 타입스크립트 설치 및 설정
타입스크립트를 사용하기위해서 일단 Node가 설치되어있어야 한다. npm 명령어로 타입스크립트를 설치해야 하기 때문이다. 설치했다면 비주얼 스튜디오의 터미널을 열고 다음 명령어를 작성한다.
npm init
(노드 프로젝트 세팅)
npm i typescript
(타입스크립트 설치)
타입스크립트를 설치한 이후부터 tsc 명령어가 사용 가능하다.
npx tsc --init
(tsconfig.json 만들기)
tsconfig.json는 타입스크립트에 대한 설정을 할 수 있는 공간이라고 생각하면 된다. 자바스크립트에서 타입스크립트로 넘어오는 사람이 해야 할 것은 다음과 같다.
allowJS : true (타입스크립트와 자바스크립트 동시에 사용 가능)
strict는 절대로 false로 하지말 것
target : 환경에 따라 타겟 변경 가능
module : import와 같은 module 설정 가능
설정 이후엔 타입스크립트 파일을 작성하려면 파일 확장자를 .ts로 만들고 사용하면 된다.
'Front-End > TypeScript 기초' 카테고리의 다른 글
[TypeScript] 타입을 집합으로 생각하자 (잉여속성검사) (0) | 2024.05.24 |
---|---|
[TypeScript] union(|), intersection(&) 그리고 상속 (extends) (0) | 2024.05.23 |
[TypeScript] 커스텀 타입, enum, keyof, typeof ~ (0) | 2023.12.18 |
[TypeScript] 타입스크립트 타입 표기법 (0) | 2023.12.14 |