타입 체킹에 대해 이야기 해왔다. 하지만 우리는 아직 타입 체커를 사용해보지 않았다. 우리의 새로운 친구인 tsc인 the TypeScript compiler 와 친해져 보자 먼저 npm을 통해 이것을 집어야 한다.
npm install -g typescript
이제 빈 폴더로 가서 첫번째 타입스크립트 프로그램을 작성해보자: hello.ts:
// 세상에 인사하기.
console.log("Hello world!");
여기에는 추가적인 장식이 없다는 걸 주목하라.(Notice there ara no frills here;) 이 "hello world" 프로그램은 자바스크립트엣허 "hello world"를 작성하는 것과 동일해 보인다. 이제 타입 체크를 커맨드 tsc를 실행해서 해보자. tsc는 typescript 패키지에 설치됐다.
tsc hello.ts
Tada!
잠깐! "tada"이 정확히 뭘까? 우리는 tsc를 실행했고 아무일도 일어나지 않았다! 이제, 타입 에러도 없었고, 콘솔에 리포트될 내용이 없어서 우리 콘솔창에 어떤 아웃풋도 없었다.
하지만 다시 체크하면 - 우리는 file 아웃풋을 대신 받을 거다. 만약 우리 현재 디렉토리를 보면, hello.ts옆에 hello.js 파일이 있을거다. 순수한 자브스크립트 파일로 tsc가 컴파일하거나 트랜스폼한 이후에 htello.ts파일로부터 나온 아웃풋이다. 그리고 우리가 내용을 체크하면, 타입스크립트가 .ts파일을 처리(process)한 후에 뱉은(spits out) 내용을 볼 거다:
// Greets the world.
console.log("Hello world!");
이 경우, 타입스크립트가 변경한 매우 작은 부분이 있어서, 우리가 쓰고자 하는 것과 동일해(identical) 보인다. 컴파일러는 사람이 쓸수 있는 것과 비슷해보이는 깨끗한 읽을수 있는 코드를 내보내려고 노력한다. 하지만 항상 쉬운건 아니지만, 타입스크립트는 들여쓰기를 반복하고, 코드가 다른 코드 라인에 걸쳐 있을 때를 감안해서 커멘트를 유지하기위해 노력한다.
타입 체킹 에러를 소개하고자 하고자 하면 어떨까? hello.ts를 다시 작성해보자:
// 상업 목적의 인사 함수:
function greet(person, date) {
console.log(`Hello ${person}, today is ${date!`);
}
greet("Brendan");
우리가 tsc hello.ts를 다시 하면, 커맨드 라인에 에러를 얻을 것이다!
Expected 2 arguments, but got 1.
타입스크립트는 greet 함수로 하나의 아규먼트를 보내는걸 잊었다고 말해주고, 당연히 그래야 한다. 지금까지 일반적인 자바스크립트만 썻는데, 타입 체킹은 여전히 우리 코드의 문제를 찾는다. 고마워 타입스크립트!
'front > ts' 카테고리의 다른 글
[The Basics] Explicit Types (0) | 2022.05.16 |
---|---|
[The Basics] Emitting with Errors (0) | 2022.05.16 |
[The Basics] Non-exception Failures (0) | 2022.05.13 |
The TypeScript Handbook (0) | 2022.05.11 |
TypeScript for JavaScript Programmers (0) | 2022.04.28 |
댓글