타입 시스템
TS의 타입 시스템은 다음과 같이 나누어 진다.
- 컴파일러에게 명시적으로 사용할 타입을 지정
- 지정되지 않은 타입을 컴파일러가 자동으로 추론
타입은 해당 변수가 할 수 있는 일을 결정한다. 그러나 작성자와 사용자가 달라지는 경우(협업 환경 등) 자바스크립트는 함수 사용법에 대해 오해를 야기할 수 있다.
function f1(a) {
return a * 30;
}
console.log(f1(10)); // 300
console.log(f1("string")); // NaN예를 들어 위와 같은 코드가 있다면 f1 함수의 작성자는 a가 number 타입이라는 가정을 바탕으로 함수를 작성하였을 것이다. 그러나 사용자가 문자열을 사용하여 함수를 실행할 경우 원하지 않는 결과인 NaN을 얻게 된다.
이러한 경우 명시적으로 타입을 지정하지 않으면 타입스크립트는 자동적으로 a를 any로 추론하게 된다. 따라서 사용자의 오해로 문자열을 이용해 함수를 실행하는 경우 똑같이 NaN이라는 잘못된 결과를 출력한다. 그렇다면 이러한 상황을 어떻게 방지할 수 있을까? 다음과 같은 tsconfig 옵션들의 도움을 받으면 사용자의 오해를 사전에 방지할 수 있다.
noImplicitAny
noImplicitAny 옵션은 타입을 명시적으로 지정하지 않은 경우, 타입스크립트 추론 중 any라고 판단되면 에러를 발생시켜 타입을 명시적으로 지정하도록 유도해준다.
function f2(a) {
// error : parameter 'a' implicitly has an 'any' type.
return a * 30;
}
// 에러가 발생하므로 작성자는 필수적으로 수정을 해야 함
console.log(f2(10));
console.log(f2("string"));에러 수정을 통해 타입이 명시적으로 지정되면 자연스럽게 사용자는 오해하지 않고 정확한 타입을 사용할 수 있게 된다.
strictNullChecks
strictNullChecks 옵션은 모든 타입에 포함되어 있는 null과 undefined를 자동으로 제거해준다.
// 매개변수의 타입은 명시적으로 지정되었으나
// 함수의 리턴 타입은 명시적으로 지정되지 않았으므로
// number | undefined 로 추론된다
function f3(a: number) {
if (a > 0) {
return a * 30;
}
}
console.log(f3(5));
console.log(f3(-5) + 5); // error: Object is possibly 'undefined'.
// 에러 수정 필요noImplicitReturns
noImplicitReturns 옵션을 킨 상태에서 함수 내에 모든 코드가 값을 리턴하지 않으면 컴파일 에러를 발생시킨다.
// 매개변수의 타입과 리턴 타입을 명시적으로 지정하였으나
// 실제 함수 구현부의 리턴 타입과 일치하지 않아 에러 발생
// error: Function lacks ending return statement and return type does not include 'undefined'
function f4(a: number): number {
if (a > 0) {
return a * 30;
}
// a가 음수인 경우에 대한 처리가 없기 때문에 undefined 리턴, 에러발생
}참고
패스트컴퍼스 - TypeScript Essentials
