[Typescript] 기본 타입

불리언 (boolean)

가장 기본적인 데이터 타입은 참/거짓(true/false) 값인 boolean이다.

let isDone: boolean = false;

숫자 (number)

TypeScript의 모든 숫자는 부동 소수 값이며, number라는 타입이 붙여진다. Typescript는 2진수, 8진수, 16진수, 10진수 리터럴을 지원한다.

let decimal: number = 6;  // 10진수
let hex: number = 0xf00d;  // 16진수
let binary: number = 0b1010;  // 2진수
let octal: number = 0o744;  // 8진수

문자열 (string)

다른 언어들처럼, Typescript에서도 텍스트 데이터 타입을 string으로 표현한다.

let color: string = "blue";

또한 Javascript처럼 템플릿 리터럴을 사용해 문자열을 작성할 수 있으며, 표현식을 포함시킬 수도 있다.

let fullName: string = `Bob Bobbington`;
let sentence: string = `Hello, my name is ${ fullName }.`

배열 (array)

Typescript에서 배열 타입은 두 가지 방법으로 사용할 수 있고, 첫 번째 방법은 대괄호([])를 쓰는 것이다.

let list: number[] = [1, 2, 3];

두 번째 방법은 제네릭 배열 타입을 사용하는 것이다.

let list: Array<number> = [1, 2, 3];

튜플 (tuple)

튜플 타입을 사용하면, 요소의 타입과 개수가 고정된 배열을 표현할 수 있다. 단, 요소들의 타입이 무조건 같은 필요는 없다.

let x: [string, number];
x = ["hello", 10];  // O
x = [10, "hello"];  // X

Javascript와 다르게, 정해지지 않은 인덱스 요소에 접근하면 에러가 발생한다.

console.log(x[2]);  // 에러 발생

열거 (enum)

enum은 0부터 시작하는 번호의 집합이다. 기본적으로, 각 번호는 enum으로 설정한 이름에 따른다.

enum Color { Red, Green, Blue };  // Red: 0, Green: 1, Blue: 2
let c: Color = Color.Green;
console.log(c);  // 1

enum은 각 멤버들의 번호를 수동으로 설정할 수 있고, 수동으로 설정한 멤버의 뒤 멤버들은 설정한 멤버의 다음 수를 따른다.

enum Color {Red = 1, Green, Blue}
let c: Color = Color.Green;
console.log(c);  // 2

모든 값을 수동으로 설정할 수 있다.

enum Color {Red = 1, Green = 2, Blue = 4}
let c: Color = Color.Green;

enum은 각 멤버의 번호로 어떤 멤버와 매칭되는지 알 수 있다.

enum Color {Red, Green = 20, Blue}
let colorName: string = Color[20];
console.log(colorName);  // Green

any

알지 못하는 타입을 표현해야 할 때가 있는데, 데이터나 서드 파티 라이브러리 같은 동적인 콘텐츠에서 올 수도 있다. any 타입을 사용할 경우, 검사를 하지 않고 컴파일 단계에 검사를 패스한다.

let notSure: any = 4;
notSure = "문자열";
notSutr = false;

Object와 비슷한 역할인 것 같지만, Object로 선언된 변수는 할당이 가능하지만 각 타입의 메서드를 호출할 수 없다.

let notSure: any = 4;
notSure.toFixed(); // O

let prettySure: Object = 4;
prettySure.toFixed(); // X 에러 발생

any는 가능한 사용하지 말자 ... 🥲

unknown

any와 상당히 유사한 타입이며, 어떤 타입이든 허용된다. 하지만, any가 컴파일을 건너뛰는 반면에 unknown 타입은 오히려 더 엄격하게 검사 또는 체크를 해야한다.

let str: unknown = 'apple'

if (typeof str === "string") console.log(str.length);  // O
console.log(str.length);  // X 에러

void

void는 어떤 타입도 존재할 수 없을을 나타내며, any의 반대 타입이다. 보통 함수에서 반환 값이 없을 때 반환 타입을 표현하기 위에 사용된다.

function warnUser(): void {
    console.log("This is my warning message");
}

void를 변수 타입으로 지정하는 것은 유용하지 않은데, 그 변수에는 null 또는 undefined만 할당할 수 있기 때문이다.

단, null을 할당할 수 있는 것은 --strictNullChecks 을 사용하지 않을 때만 해당된다.(다음 섹션 참고)

let unusable: void = undefined;
unusable = null; // --strictNullChecks을 사용하고 있지 않다면 O

null and undefined

** 가능한 경우 --strictNullChecks 옵션을 사용할 것을 권장하며, 본 문서에서는 사용하지 않는다고 가정한다.

let u: undefined = undefined;
let n: null = null;

--strictNullChecks 옵션을 사용하면 any와 각자 자신들 타입에만 할당 가능하다.(예외적으로, undefined는 void 타입에 할당 가능하다.)

never

절대 발생할 수 없는 타입을 나타낸다. 예를 들어 함수에서 항상 오류를 발생시키거나, 절대로 반환하지 않는 반환 타입으로 쓰인다.

never 타입은 모든 타입에 할당 가능한 하위 타입이지만, 반대로 그 어떤 타입도 never에 할당할 수 없다.

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function error(message: string): never {
    throw new Error(message);
}

// 항상 에러가 발생, 반환 타입이 never로 추론된다.
function fail() {
    return error("Something failed");
}

// never를 반환하는 함수는 함수의 마지막에 도달할 수 없다.
function infiniteLoop(): never {
    while (true) {
    }
}

object

object는 원시 타입이 아닌 타입을 나타낸다. 예를 들어 number, string, boolean, bigint, symbol, null, 또는 undefined 타입이 아닌 나머지를 의미한다.

declare function create(o: object | null): void;

create({ prop: 0 }); // O
create(null); // O

create(42); // X
create("string"); // X
create(false); // X
create(undefined); // X

type assertions (타입 단언)

Typescript의 자체 판단보다 개발자가 컴파일러에게 해당 타입이 맞다는 믿음을 주는 방법이며, 두 가지 형태가 있다.

첫 번째는 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 스타일의 단언만 허용된다.