Typescript as const 효과적인 상수관리

리터럴 타입(readonly)과 프리미티브 타입

타입스크립트에서는 string, number 등과 같이 포괄적인 타입에도 명확한 값(리터럴 타입)을 설정하는것이 가능하다

예를들어 아래와 같이 name을 let으로 선언했을경우 string타입이라는 포괄적인 의미를 가지고있는 primitive type을 갖는다

let name = '홍길동';
console.log(typeof(name)); // string 타입으로 출력

하지만 아래와 같이 let으로 선언했는데도 불구하고 as const 키워드를 사용하면 정확한 값을 타입으로 갖는 리터럴 타입(readonly)을 갖게할 수 있다 아래 코드를 보면 let으로 name만 선언했을경우 추론적인 string타입이었겠지만 as const키워드를 붙였기때문에 name에는 정확한 값인 홍길동의 값만 갖을 수 있다

let name = '홍길동' as const;
name = "이순신" // error Type '이순신' is not assignable to type '홍길동'

객체에서의 상수 관리

아래 코드와 같이 Colors라는 각 컬러 데이터를 담은 객체 변수를 만들었을때를 예를들어보자

해당 객체의 각 속성(red,blue,green)의 추론된 값을 보면 리터럴 타입(readonly)이 아닌 프리미티브 타입으로 추론된 것을 알 수 있다

그 이유는 객체는 언제든 객체 내부의 값들을 바꿀 수 있기 때문이다.

const Colors = {   
    red: "#FF0000",   
    blue: "#0000FF",   
    green: "#008000", 
}

그럼 어떻게해야 속성들도 값을 고정해버리는 강력한 리터럴 타입으로 지정할 수 있을까?

바로 위에서 배운 as const 키워드를 아래 코드처럼 동일하게 사용하면 된다

const Colors = {   
    red: "#FF0000",   
    blue: "#0000FF",   
    green: "#008000", 
} as const;