해당 포스팅은 인사이트의 이펙티브 타입스크립트라는 책을 독학하며 기록하는 글입니다.
타입스크립트는 자바스크립트의 상위집합(superset)이다. 이는 자바스크립트 프로그램에 문법 오류가 없다면, 유효한 타입스크립트 프로그램이라고 할 수 있다는 것이다.
하지만 이 명제의 역은 항상 '참'을 나타내지 않는다.
- 모든 자바스크립트 프로그램은 타입스크립트 프로그램이다. - 참
- 모든 타입스크립트 프로그램은 자바스크립트 프로그램이다. - 거짓
왜 역의 경우에는 거짓일까? 타입스크립트에서는 자바스크립트에서는 없는 타입을 명시하는 추가적인 문법을 가지고 있기 때문이다.
// example.ts
const name: string = 'Matthias';
// example.js
const name: string = 'Matthias';
^
SyntaxError: Unexpected token
타입스크립트는 비단 타입값의 오류만 잡아주는 것이 아니다. 다음 코드를 보자.
let city = 'Seoul';
console.log(city.toUppercase());
^
Error: 'toUppercase' 속성이 'string' 형식에 없습니다.
이렇게 타입스크립트는 런타임에 오류를 발생시킬 코드를 미리 찾아내는데, 이런 이유로 타입스크립트를 '정적' 타입 시스템이라고 하는 것이다.
근데 이 코드에서 우리는 city라는 변수가 string 타입이라는 것을 명시하지 않았는데 타입스크립트는 어떻게 string 타입이라는 것을 알았을까?
- '타입 추론' 이라는 기능 때문인데 이후에 좀 더 자세히 알아보자.
타입스크립트 타입 시스템은 자바스크립트의 런타임 동작을 '모델링'하는데, 이는 타입스크립트 타입 시스템의 기본 원칙이다.
예를 들어 다음 코드는 다른 언어였다면 런타임 에러가 났을 것이다.
const x = 2 + '3';
하지만 타입스크립트에서는 오류가 나지 않는다. 바로 자바스크립트에서 위의 코드는 아래 원칙에 의해 '23'이라는 문자열로 정상동작 하기때문이다.
'+' 연산자의 두 피연산자 중 한 피연산자라도 문자열이라면 다른 피연산자도 문자열로 변환해 연산한다.
반대로 정상동작하는 코드에 대해서 오류를 표시하는 경우도 있다. 이렇듯 타입스크립트를 사용한다고 모든 정적 타입의 정확성을 보장해 줄거라고 생각하면 안 된다.
타입스크립트의 설정은 100여개나 될 정도로 많은데, 이는 tsconfig.json
파일을 이용해 설정할 수있다. 동료들이나 다른 도구들이 타입스크립트를 어떻게 사용할 계획인지 알게하기 위해 설정 파일을 사용하는 것이 좋다.
설정 파일은 커맨드 라인에서
tsc --init
명령어를 통해 쉽게 생성할 수 있다.
이때 다른 설정들은 재처 놓더라도 프로젝트를 처음 시작한다면 noImplicitAny
와 strictNullChecks
는 꼭 설정하도록 하자.
타입스크립트는 타입을 명시하지 않으면 암묵적으로 타입을 Any로 추론하는데, 이를 허용하지 않겠다는 것이다. 물론 더 분명한 타입을 사용하면 좋겠지만 그게 어렵다면 Any라도 명시적으로 표현해줘야 한다.
이 설정을 해제하는 상황은 자바스크립트로 되어 있는 기존의 프로젝트를 타입스크립트로 전환하는 상황에만 필요하다.
function add(a, b) {
^
Error: 'a' 매개변수에는 암시적으로 'any' 형식이 포함됩니다.
return a + b;
}
null
이나 undefined
가 모든 타입에서 허용될지를 설정하는 것으로 이를 사용하지 않는다면 "undefined는 객체가 아닙니다"라는 런타임 오류를 끊임없이 겪을 것이다.
// strictNullChecks 해제시
const name: string = undefined
// strictNullChecks 설정시
const name: string = undefined
^
Error: 'undefined' 형식은 'string' 형식에 할달할 수 없습니다.
만약 설정하고도 null
이나 undefined
를 사용하고 싶다면 |
를 사용해 명시적으로 나타내주거나 이를 체크하는 코드를 추가해줘야 한다.
만약 모든 설정을 체크하고 싶다면 strict
설정을 하면 된다. 그럼 대부분의 오류를 잡아내게 된다. 만약 내 컴퓨터에서는 잘 동작하는 타입스크립트 파일을 동료에게 줬는데 동료의 컴퓨터에서 오류가 난다면 타입스크립트 설정이 동일하지 확인해봐야 한다. (보통 설정 파일은 github에 올라가지 않기 때문에)