리터럴 타입이라 함은 변수나 매개변수 등이 string이나 number처럼 어떤 포괄적인 타입을 가지는 것이 아니라, 변수나 매개변수에 정확한 값을 설정하는 것을 의미한다. 특정한 값을 변수의 타입으로 지정하는 것.

const helloWorld = "Hello World";  // string 타입이 아닌 "Hello World" 타입

let hiWorld = "Hi World"; // string 타입

예를 들어 const 변수의 경우에는 이 변수가 절대로 변경되지 않기 때문에 위의 예제에서 string이 아닌 그 문자열 값 그대로 타입이 된다. 이에 반해 let은 변경될 수 있기 때문에 string이라고 컴파일러가 설정해주게 된다.

문자열 리터럴 타입

문자열 리터럴 타입을 사용해서 enum과 비슷하게 사용할 수 있다.

type Easing = "ease-in" | "ease-out" | "ease-in-out"

class UIElement {
    animate(dx: number, dy: number, easing: **Easing**) {  // easing의 타입이 문자열 리터럴.
        if (easing === "ease-in") {}
        else if (easing === "ease-out") {}
        else {}
    }
}

let button = new UIElement();
button.animate(0, 0, "ease-in")
button.animate(0, 0, "uneasy")  // 오류! 설정되지 않은 문자열

animate의 세 번째 인자는 string 값도 ease-in이지만, 그 타입도 Easing으로 타입이 좁혀지면서 Easing 안의 세 값과 같아야 한다…?

숫자형 리터럴 타입

숫자형으로도 똑같이 리터럴을 사용할 수 있다.

function rollDice(): 1 | 2 | 3 | 4 | 5 | 6 {
    return (Math.floor(Math.random() * 6) + 1) as 1 | 2 | 3 | 4 | 5 | 6;
}

const result = rollDice();

꼭 설정을 해 놓아야 하는 값일 경우 숫자형 리터럴 타입으로 필터링하면서 사용할 수 있다.

function setupMap(config: MapConfig): void {};

interface MapConfig {
    lng: number;
    lat: number;
    tileSize: 8 | 16 | 32;
}

setupMap({lng: -73.123, lat: 65.452, tileSize: **16**})  // 꼭 8, 16, 32 중 하나!