Typescript Introduction

Posted on | 0 comments

TypeScript 데이터 타입

let isDone: boolean = false;
  • Boolean
  • Number

  • String

  • Array
let list: number[] = [1, 2, 3];         
let list: Array<number> = [1, 2, 3];    // 제네릭 배열 타입
  • Tuple

튜플 타입은 고정된 개수의 요소 타입을 알고 있지만, 반드시 같을 필요는 없는 배열을 표현할 수 있다.

// 튜플 타입 선언
let x: [string, number];
// 초기화
x = ["hello", 10]; // 좋아요
// 부정확한 초기화
x = [10, "hello"]; // Error

console.log(x[0].substr(1)); // 좋아요
console.log(x[1].substr(1)); // Error, 'number'은 'substr'을 가지고 있지 않습니다.

알려진 인덱스 집합 외부의 요소에 접근할 경우, Union 타입이 사용된다.

  • Enum

enum은 상수처럼 쓰일 변수에 대한 집합에 붙이는 타입이다.

Before

const Color = Object.freeze({
    Red: 1,
    Green: 2,
    Blue: 3
});

After

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

enum은 숫자 값에서 enum의 해당 값 이름으로 이동할 수 있다는 것이 특징이다.

enum Color {Red = 1, Green, Blue}
let colorName: string = Color[2];

alert(colorName); // 위의 값이 2 이므로 'Green'을 표시합니다.
  • Any

알지 못하는 변수의 타입을 사용할 때, 타입 검사를 하지 않고 그 값이 컴파일-타임 검사를 통과하도록 하는 것이 any 타입이다.

any 타입은 컴파일 과정에서 타입 검사를 실행 및 중지할 수 있다. 객체 또한 비슷한 역할을 한다.

let notSure: any = 4;
notSure = "문자열일수도 있다";
notSure = false; // 좋아요, 확실한 boolean
  • Object

Object 타입 또한 비슷한 역할을 하지만, Object 타입의 변수를 사용하면 해당 Object에는 값만 할당할 수 있다.

let notSure: any = 4;
notSure.ifItExists(); // 좋아요, 런타임에 ifItExists가 존재할 수 있습니다.
notSure.toFixed(); // 좋아요, toFixed는 존재합니다. (그러나 컴파일러는 체크하지 않습니다)

let prettySure: Object = 4;
prettySure.toFixed(); // 오류: 'Object' 타입에 'toFixed' 프로퍼티는 존재하지 않습니다.
  • Void

일반적으로 반환 값을 반환하지 않는 함수의 반환 타입으로 쓰인다.

function warnUser(): void {
    alert("This is my warning message");
}

void 타입의 변수 선언은 undefined나 null만 할당할 수 있다.

  • Null, Undefined

타입스크립트에서 undefined와 null 값을 실제로 undefined와 null 이라는 타입을 가진다. 잘 쓰이지 않는다.

string 또는 undefined와 null 중 하나를 전달는 경우, string | null | undefined라는 Union 타입을 사용할 수 있다.

  • Never

never 타입은 절대로 발생하지 않는 값의 타입을 나타낸다.

함수 표현식의 반환 타입, 또는 항상 예외를 던지는 화살표 함수 표현식일 때 사용한다.

// 반환되는 함수에는 연결할 수 없는 end-point가 있어서는 안 됩니다.
function error(message: string): never {
    throw new Error(message);
}

// 추론되는 반환 타입은 절대로 없습니다.
function fail() {
    return error("Something failed");
}

// 반환되는 함수에는 연결할 수 없는 end-point가 있어서는 안 됩니다.
function infiniteLoop(): never {
    while (true) {
    }
}
  • 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;

typescript를 JSX와 사용할 경우에는 as 스타일만 허용된다.