[typescript] Literal Types와 as const

Liter Type

string, number와 같은 타입만이 타입이 될 수 있는게 아니다. 일반 글자같은 것도 타입이 될 수 있다.

<script>
let yong : 'cute';
let sang : 'sexy';
</script>

위 코드를 보면 yong이라는 변수는 이제 'cute'라는 글자만 할당할 수 있고, sang이라는 변수는 'sexy'라는 글자만 할당할 수 있다.

이렇게 특정 글자나 숫자만 가질 수 있게 제한을 두는 타입을 literal type이라고 부른다.

<script>
let 방향 : 'left' | 'right';
방향 = 'left';
</script>

iteral type은 or 기호를 사용해서 위 처럼 두 가지 타입도 지정할 수 있다.

<script>
function hello(a : 'hello') : 1 | 0 | -1 {
	return 1
}
</script>

함수도 마찬가지로 파라미터 타입선언을 할 때 글자나 숫자를 집어넣으면 집어넣은 타입만 파라미터로 사용할 수 있고, return 타입선언할 때도 글자나 숫자를 집어넣으면 그 값만 return 할 수 있다.

as const 문법

<script>
var hello = {
	name : 'yong'
}

// console.log(hello.name) -> 'yong'

function hi(a : 'yong') {

}
hi(hello.name)
</script>

'yong'이라는 타입만 들어올 수 있는 함수를 만들었다. 여기서 hello.name('yong')을 함수에 입력하면 에러가 발생한다. 이유는 함수는 'yong' 타입만 입력할 수 있고 hello.name의 타입 자체는 string이기 때문에 에러가 발생한다.

이럴 때 사용할 수 있는 여러 방법중 한 가지가 as const이다.

<script>
var hello = {
	name : 'yong'
} as const;

function hi(a : 'yong') {

}
hi(hello.name)
</script>

as const는 object 자료에 붙일 수 있고 타입을 object의 value로 바꿔준다. (타입을 'yong'으로 변경) 또한 object안에 있는 모든 속성을 readonly로 바꿔주는 효과가 있다.

object를 잠그는 코드를 짜고 싶을 때 as const를 활용하면 좋을 것 같다.