타입 스크립트에서 사용하는 타입 중에 string, number, boolean, undefined, null 타입에 대해 알아보자.
JavaScript에서 아주 흔하게 사용되는 세 가지의 원시 타입인 string, number 그리고 boolean에 대해 먼저 배워보자.
TypeScript는 단지 타입만 지정해주는 것으로 script와 사용법이 동일하다 생각하면 된다.
문자열 (String)
기본적으로 JavaScript에서 사용하는 것과 마찬가지로 큰 따옴표, 작은따옴표 그리고 당연히 백 틱도 사용할 수 있다.
let str: string = "Hello World!";
str = 'Hello TS';
const blog = 'mine-it-record';
str = `Hello, my ${blog} blog`;
숫자 (Number)
JavaScript와 마찬가지로 TypeScript 역시 모든 숫자는 부동 소수 값이다.
let num: number = 6;
num = 7;
num = Number('8');
불리언 (Boolean)
불리언 값 역시 동일하게 참/거짓(true/false) 값을 가진다.
let isBoal: boolean = true;
Null 과 Undefined
기본적으로 null과 undefined는 모든 타입의 하위 타입으로 number 같은 타입에 할당할 수 있는데,
--strictNullChecks ( tsconfig.json 이나 jsconfig.json 파일에 설정하거나 기본적으로 VSCode 설정 탭에서 설정이 가능하다.)를 사용하게 되면 null과 undefined는 오직 any 타입과 각자 자신들 타입에만 할당 가능하다. (예외로 undefined는 void에 할당 가능하다.)
// 이 밖에 이 변수들에 할당할 수 있는 값이 없어 사용하지 않는다.
let u: undefined = undefined;
let n: null = null;
// 나중에 유니온 타입에서 정리하겠지만 보통 이런식으로 사용된다.
let num: number | undefined;
let str: string | null;
추가적으로 strinctNullChecks 옵션을 설정하는 것을 항상 권장하기도 하며, 저렇게 유니온 타입을 통해 undefined와 null을 넣어주었다면 코드의 안정성을 위해 항상 체크를 해줘야 한다.
// 단순 체크
function doSomething(x: string | undefined) {
if (x === undefined) {
// 아무 것도 하지 않는다
} else {
console.log("Hello, " + x.toUpperCase());
}
}
// 접미사(!) 사용
function liveDangerously(x?: number | undefined) {
// 오류 없음
console.log(x!.toFixed());
}저렇게 두 가지 방법이 있는데, 아래에 접미사 느낌표를 사용한 예제를 보면 코드가 참 간결해 보이겠지만, 저 느낌표는 해당 값은 null이나 undefined가 절대 들어올 리 없다 라는 것을 명시해주는 것이기 때문에 사실상 사용을 권장하지 않는다.
해당 게시글은 자바스크립트 원시 타입을 기준으로 정리해봤는데, 나중에 추가될 수도 있겠지만 현재까지는 총 7개로 string, number, boolean, undefined, null, symbol, bigint 그중에서 symbol과 bigint를 제외하고 정리하였다.
사실 symbol과 bigint는 특수한 상황이 아니면 사용하지 않기 때문에 그래도 사용법을 알고 싶다면 아래 링크를 통해 타입 스크립트 핸드북에서 확인해보도록 하자.
참고: https://www.typescriptlang.org/docs/handbook/2/everyday-types.html
Documentation - Everyday Types
The language primitives.
www.typescriptlang.org
댓글