기본 타입
Type
값으로 할 수 있는 일의 집합
타입과 서브 타입
| 타입 | 서브타입 |
|---|---|
| Boolean | 불 리터럴 |
| bigint | 큰 정수 리터럴 |
| number | 숫자 리터럴 |
| string | 문자열 리터럴 |
| symbol | unique symbol |
| object | 객체 리터럴 |
| Array | 튜플 |
| enum | const enum |
number
const num: number = 1;
string
const str: string = 'Hello';
boolean
const bool: boolean = false;
undefined
let age = number | undefined;
- 보통 undefined은 다른 타입과 함께 쓴다.
null
let person: string | null;
- 보통 null은 다른 타입과 함께 쓴다.
any
let anything: any = 0;
anything = 'hello';
anything = 'true';
- any 타입으로 뭐든지 할 수 있지만 꼭 필요한 상황이 아니라면 사용하지 않는 것이 좋다.
- any는 모든 값의 집합이며 any를 사용하면 값이 자바스크립트처럼 동작하기 시작하면서 타입 검사기가 작동하지 않게 된다.
unknown
let a: unknown = 30; // unknown
let b = a === 123; // boolean
let c = a + 10; // 에러 발생
if (typeof a === 'number') {
// 타입 검사
let d = a + 10; // number
}
- 타입을 미리 알 수 없는 어떤 값이 있을 때 any 대신 unknwon 타입을 사용하는 것이 좋다.
- unknown 타입은 타입을 검사해 정제하기 전까지는 타입스크립트가 unknown 타입의 값을 사용할 수 없도록 강제한다.
- 너무 추상적이라 가능한한 사용하지 않는 것을 권장한다.
타입 별칭
let, const, var 등으로 변수를 선언해서 값 대신 변수로 칭하듯 타입 별칭으로 타입을 가리킬 수 있다.
type Age = number;
type Person = {
name: string;
age: Age;
};
타입 별칭을 이용하면 형태를 조금 더 이해하기 쉽게 정의할 수 있다.
타입스크립트는 별칭을 추론하지는 않으므로 반드시 별칭의 타입을 명시적으로 정의해야 한다.
자바스크립트의 변수와 마찬가지로 하나의 타입을 두 번 정의할 수는 없다.
type Color = 'red';
type Color = 'blue'; // 에러 발생, 식별자를 중복 정의
타입 별칭도 블록 영역에 적용된다.
모든 블록과 함수는 자신만의 영역을 가지므로 내부에 정의한 타입 별칭이 외부의 정의를 덮어쓴다.
type Color = 'red';
let x = Math.random() < 5;
if (x) {
type Color = 'blue'; // 위의 Color 정의를 덮어씀
let b: Color = 'blue';
} else {
let c: Color = 'red';
}
null, undefined, void, never
| 타입 | 의미 |
|---|---|
| null | 값이 없음 |
| undefined | 아직 값을 변수에 할당하지 않음 |
| void | return문을 포함하지 않는 함수 |
| never | 절대 반환하지 않는 함수 |
열거형 (enum)
enum은 해당 타입으로 사용할 수 있는 값을 열거하는 기법이다.
열거형은 키를 값에 할당하는 순서가 없는 자료구조이다.
키가 컴파일 타입에 고정된 객체라고 생각하면 쉬우며
타입스크립트는 키에 접근할 때 주어진 키가 실제 존재하는지 확인할 수 있다.
문자열에서 문자열로 매핑
enum Language {
English, // [0]
Spanish, // [1]
Russian, // [2]
}
문자열에서 숫자로 매핑
enum Language {
English = 3, // [3]
Spanish = 5, // [5]
Russian, // [6]
}
enum에서 값을 가져올 때 점 또는 괄호 표기법으로 열거형 값에 접근할 수 있다.
let myFirstLanguage = Language.Russian; // 점 표기법
let mySecondLanguage = Language['English']; // 괄호 표기법
열거형 멤버에 명시적으로 값을 할당하기 (열거형 합치기)
enum Language {
English = 0,
Spanish = 1,
}
enum Language {
Russian = 3, // Language = [English = 0, Spanish = 1, Russian = 3]
}
계산된 값을 사용하여 타입을 추론시킬 수도 있다.
enum Language {
English = 100,
Spanish = 200 + 300,
Russian, // 타입스크립트가 500 다음 501 숫자로 추론
}
열거형에 문자열 값이나 문자열과 숫자를 혼합할 수 있다.
enum Color {
Red = '#c10000',
Blue = '#007ac1',
Pink = 0xc10050,
White = 255,
}
let red = Color.Red; // '#c10000'
let pink = Color.Pink; // 0xc10050
타입스크립트에서는 값이나 키로 열거형에 접근할 수 있도록 허용하지만 이는 불안정한 결과를 초래하기 쉬우며
안전하게 const enum을 이용하면 타입스크립트가 안전하지 않은 작업을 막도록 만들 수 있다.
cosnt enum Language {
English,
Spanish,
Russian
}
// 유효한 enum 키 접근
let a = Language.English // Language
// 유효하지 않은 enum 키 접근
let b = Language.Tagalog // 에러 발생, 접근 불가능
let c = Language[0] // 접근 불가능
const enum은 문자열 값을 갖는 열거형을 사용해야 한다.
const enum의 사용 방법 예시
const enum Flippable {
Burger,
Chair,
Cup,
Skateboard,
Table,
}
function flip(f: Flippable) {
return 'flippable it';
}
flip(Flippable.Chair); // 'flippable it'
flip(Flippable, Cup); // 'flippable it'
flip('Hat'); // 에러 발생
flip(12); // 에러 발생