원시타입
원시 타입(Primitive Type)은 동시에 한개의 값만 저장할 수 있는 타입들을 말합니다. 예를 들어 원시 타입이 아닌 배열이나 객체 같은 비 원시 타입들은 동시에 여러개의 값들을 저장할 수 있는 반면, number, string, boolean 등의 원시 타입은 숫자면 숫자, 문자열이면 문자열 딱 하나의 값만 저장할 수 있습니다.
원시 타입은 여러 타입들중 가장 기본이 되는 타입입니다. 따라서 타입스크립트의 여러 기본타입들 중 원시 타입에 대해서 먼저 살펴봅니다.
실습 환경 설정
이전 시간에 만들어 둔 section2 패키지를 VsCode에서 열고 src 폴더 아래에 새로운 파일 chapter1.ts를 생성합니다. 이번 시간에 작성하는 모든 코드는 이 파일에 작성합니다.
이때 tsconfig.json에 isolateModules 옵션이 true로 설정되어 있기 때문에 export 키워드를 하나 이상 사용해야 함을 주의합니다.
number 타입
코드를 불러오는 중 입니다 ...number 타입은 자바스크립트에서 숫자를 의미하는 모든 값을 포함하는 타입입니다. 단순 정수 뿐만 아니라 소수, 음수, Infinity, NaN등의 특수한 숫자들도 포함합니다.
참고로 이때 이때 변수의 이름 뒤에 콜론(:)과 함께 변수의 타입을 정의하는 이런 문법을 ‘타입 주석’ 또는 ‘타입 어노테이션’이라고 부릅니다.
코드를 불러오는 중 입니다 ...이때 number 타입으로 정의한 변수에는 number 타입을 제외한 값을 할당할 수 없으며, number 타입의 값이 사용할 수 없는 toUpperCase 등의 메서드는 사용할 수 없습니다.
string 타입
코드를 불러오는 중 입니다 ...string 타입은 문자열을 의미하는 타입입니다. 단순 쌍따옴표 문자열 뿐만 아니라 작은 따옴표, 백틱, 템플릿 리터럴로 만든 모든 문자열을 포함합니다.
boolean 타입
코드를 불러오는 중 입니다 ...boolean 타입은 참과 거짓만을 저장하는 타입입니다. true 또는 false만 이 타입에 해당됩니다.
null 타입
코드를 불러오는 중 입니다 ...null 타입은 오직 null 값만 포함하는 타입입니다.
undefined 타입
코드를 불러오는 중 입니다 ...undefined 타입 역시 null 타입과 마찬가지로 오직 하나의 값 undefined만 포함하는 타입입니다.
null 값을 다른 타입의 변수에 할당하기
자바스크립트에서는 다음과 같이 아직 값이 정해지지 않은 상태에서는 변수에 null 을 임시로 넣어두곤 했습니다.
코드를 불러오는 중 입니다 ...그러나 만약 타입스크립트에서는 이 numA가 만약 number 타입의 변수일 경우 다음과 같이 오류가 발생합니다
코드를 불러오는 중 입니다 ...null은 number 타입에 포함되는 값이 아니기 때문에 오류가 발생하는 것 입니다.
그러나 앞서 이야기 했듯 null 값을 변수의 임시값으로 활용하고 싶은 상황이 충분히 있을 수 있습니다.
이럴 때에는 다음과 같이 tsconfig.json의 strcitNullChecks(엄격한 null 검사) 옵션을 false로 설정하면 됩니다.
코드를 불러오는 중 입니다 ...strictNullChecks 옵션은 타입스크립트에서 null 값을 null 타입 이외의 타입의 변수에 할당하는 것을 금지할지 허락할지 여부를 결정하는 옵션입니다. 기본값은 true이며 이 옵션이 true로 켜져있을 경우 엄격하게 null 값을 검사해 null 타입이 아닌 변수에는 null 값을 할당할 수 없도록 제한합니다. 그런데 위 코드처럼 false로 설정해 이 옵션을 끌 경우 어떤 타입의 변수든 null 값을 자유롭게 할당할 수 있습니다.
또 이 옵션은 이름에서 알 수 있듯 strict 옵션의 하위 옵션입니다. 따라서 strict 옵션이 true이면 자동으로 true로 설정되며 반대로 strict 옵션이 false이면 자동으로 false로 설정됩니다. 만약 위 코드처럼 우리가 직접 설정하면 설정된 옵션에 따릅니다.
이 옵션은 안전한 타입스크립트 코드를 작성하는 측면에서는 그닥 큰 도움이 되지는 않으니 지금은 true로 설정하거나 아예 옵션 설정을 지우겠습니다.
코드를 불러오는 중 입니다 ...이렇게 타입스크립트의 5가지 원시타입과 null 값을 사용할 때 엄격하게 검사할지 여부를 결정하는 strictNullChecks 옵션까지 추가로 알아보았습니다.
리터럴 타입
타입스크립트에는 string, number 처럼 범용적으로 많은 값을 포함하는 타입 뿐만 아니라 딱 하나의 값만 포함하는 타입도 존재합니다. 따라서 다음과 같이 변수의 타입을 숫자 10으로 설정하는 것 또한 가능합니다.
코드를 불러오는 중 입니다 ...변수 numA의 타입을 숫자 10으로 설정했습니다. 이렇게 설정하면 이제 numA에는 10 이외의 값을 저장할 수 없게 됩니다.
이렇듯 하나의 값만 포함하도록 값 자체로 만들어진 타입을 타입스크립트에서는 ‘리터럴 타입’이라고 부릅니다. 참고로 여기서 리터럴은 우리말로 ‘값’ 이라는 뜻 입니다.
숫자 값 뿐만 아니라 문자열이나 불리언 타입의 값도 모두 리터럴 타입으로 만들 수 있습니다.
코드를 불러오는 중 입니다 ...