타입스크립트는 자바스크립트와 거의 동일한 데이터 타입을 지원하며, 열거 타입을 사용해 더 편리하게 사용할 수 있다.
1. 불리언(Boolean)
boolean 값이라고 일컫는 참/거짓(true/false) 값이다.
let isDone: boolean = false;2. 숫자(Number)
자바스크립트와 동일하게 타입스크립트의 모든 숫자는 부동 소수 값이며 부동 소수에는 number 라는 타입이 붙여진다.
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;3. 문자열(String)
텍스트 데이터 타입은 string 으로 표현한다.
let color: string = "blue";
color = 'red';4. 배열(Array)
배열은 두 가지 방법으로 사용할 수 있다.
첫 번째는 배열 요소들을 나타내는 타입 뒤에 [] 를 쓰는 것이다.
let list: number[] = [1, 2, 3];두 번째 방법은 제네릭 배열 타입을 쓰는 것이다. Array<elemType>
let list: Array<number> = [1, 2, 3];5. 튜플(Tuple)
튜플 타입을 사용하면 요소의 타입과 개수가 고정된 배열을 표현할 수 있으며 요소들의 타입이 모두 같을 필요가 없다.
let x: [string, number];
x = ['hello', 10]; // 초기화 성공
x = [10, 'hello']; // 잘못된 초기화 - 오류 발생
// 정해진 인덱스에 위치한 요소에 접근하면 해당 타입이 나타난다.
console.log(x[0].substring(1)); // 성공
console.log(x[1].substring(1)); // 오류(number에는 substring이 없기 때문에 오류 발생)
// 정해진 인덱스 외에 다른 인덱스에 있는 요소에 접근하면 오류가 발생한다.
x[3] = 'world'; // 오류, [string, number] 타입에는 프로퍼티 3이 없다.
console.log(x[5].toString()); // 오류, [string, number] 타입에는 프로퍼티 5가 없다.6 열거(Enum)
enum 은 값의 집합에 더 나은 이름을 붙일 수 있다. enum 은 0 부터 시작해서 맴버들의 번호를 매긴다. 맴버 중 하나의 값을 수동으로 설정해 번호를 바꿀 수 있다.
// 0 부터 번호를 매긴다.
enum Color { Red, Green, Blue }
let color: Color = Color.Green;
// 0이 아닌 1로 시작하게 설정이 가능하다.
enum Color { Red = 1, Green, Blue }
let color: Color = Color.Green;
// 모든 값을 수동으로 설정이 가능하다.
enum Color { Red = 1, Green = 3, Blue = 6 }
let color: Color = Color.Green;enum 의 유용한 기능 중 하나는 매겨진 값을 이용해서 enum 멤버의 이름을 알아낼 수 있다.
enum Color { Red = 1, Green, Blue }
let colorName: string = Color[2];
console.log(colorName); // Green7. Any
알지 못하는 타입(사용자로부터 받은 데이터나, 서드 파티 라이브러리 같은 동적인 컨텐츠로 온 값들)을 표현해야 할 때, 타입 검사를 하지 않는 any 를 사용할 수 있다.
let notSure: any = 4;
notSure = "maybe a string instead";
notSure = false; // 성공,
any 타입은 컴파일 중 타입 검사를 할 수도 있고 안할 수도 있다. Object 로 선언된 변수들은 어떤 값이든 그 변수에 할당할 수 있다는 점에서 any 와 비슷한 역할을 할 수 있을 것 같지만, 실제로는 메서드가 존재하더라도 임의로 호출할 수 없다.
let notSure: any = 4;
notSure.ifItExists(); // 성공, ifItExists는 런타임엔 존재할 것이다.
notSure.toFixed(); // 성공, toFixed는 존재한다.(컴파일러는 검사하지 않는다.)
let prettySure: Object = 4;
prettySure.toFixed(); // 오류, 프로퍼티 toFixed는 Object에 존재하지 않는다.any 타입은 타입의 일부만 알고 전체는 알지 못할 때 유용하다. 예를 들어, 여러 다른 타입이 섞인 배열을 다룰 수 있다.
let list: any[] = [ 1, true, 'free' ];
list[1] = 100;8. Void
void 는 어떤 타입도 존재할 수 없음을 나타내기 때문에 any 와 반대 타입이다. void 는 보통 함수에서 반환 값이 없을 때 반환 타입을 표현하기 위해서 사용한다.
function warnUser(): void {
console.log('This is my warning message');
} void 를 타입 변수로 선언하는 것은 유용하지 않다. 이유는 그 변수에 null (--strictNillChecks를 사용하지 않을 때에만 해당) 또는 undefined 만 할당할 수 있기 때문이다.
let unusable: void = undefined;
unusable = null; // 성공, --strictNullChecks 를 사용하지 않을 때9. Null and Undefined
let u: undefined = undefined;
let n: null = null;기본적으로 null 과 undefined 는 다른 모든 타입의 하위 타입이어서 number 같은 타입에 할당할 수 있다.
하지만 --strictNullChecks 를 사용하면 null 과 undefined 는 오직 any 와 각자 자신들 타입에만 할당 가능하다. ( 예외로 void 에는 할당이 가능하다. )
--strictNullChecks 는 일반적인 에러를 방지하는데 도움을 주므로 사용하는 것을 권장한다. 만약 null 과 undefined 를 허용하고 싶다면 유니온 타입인 number | null | undefined 를 사용할 수 있다.
유니온 타입은 이후 챕터에서 다룬다.
10. Never
never 타입은 절대 발생할 수 없는 타입을 나타낸다. 예를 들어, 함수 표현식이나 화살표 함수 표현식에서 항상 오류를 발생시키거나 절대 반환하지 않는 반환 타입으로 사용된다. 변수도 never 타입을 얻게 될 수 있다.
// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function error(message: string): never {
thorw new Error(message);
}
// 반환 타입이 never로 추론된다.
function fail() {
return error("Something failed");
}
// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function infiniteLoop(): never {
while(true) { }
}11. 객체(Object)
object 는 원시 타입이 아닌 타입을 말한다. number, string, boolean, bigint, symbol, null, undefined 가 아닌 나머지를 의미한다.
object 타입을 사용하면 object.create 와 같은 API가 잘 나타난다.
declare키워드를 사용해서 정의해두면 type이 인식되어 타입스크립트 컴파일러가 해석할 수 있다.
declare function create(o: object | null): void;
create({ prop: 0 }); // 성공
create(null) // 성공
create(42); // 오류
create("string"); // 오류
create(false); // 오류
create(undefined); // 오류12. 타입 단언(Type assertions)
타입 단언은 개발자가 값에 대해 더 잘 알고 있을 때 컴파일러에게 타입을 단언하는 방법이다. 타입 단언에는 두 가지 형태가 있다.
// 첫 번째는 angle-bracket 문법이다.
let someValue: any = "this is a string";
let strLength: number = (<string>someValue).length;
// 두 번째는 as 문법이다.
let someValue: any = "this is a string";
let strLength: number = (someValue as string).length;위 예제는 동일하며 어떤 것을 사용할지는 선호도에 따른 선택이지만, 타입스크립트를 JSX와 함께 사용한다면 as 스타일의 단언만 허용한다.
