[typescript] Literal Types로 만드는 const 변수 유사품

조수진·2023년 7월 17일

[Literal Type 만드는 법 ]
string, number 이런 것만 타입이 될 수 있는게 아닙니다.
일반 글자같은 것도 타입이 될 수 있습니다.

let john :'대머리';
let kim :'솔로';

john이라는 변수는 이제 '대머리' 라는 글자만 할당할 수 있습니다.
kim이라는 변수는 이제 '솔로' 라는 글자만 할당할 수 있습니다.
특정 글자나 숫자만 가질 수 있게 제한을 두는 타입을 literal type 이라고 부릅니다.

let 방향: 'left' | 'right';
방향 = 'left';

or 기호 써도 됩니다. 이제 'left' 또는 'right' 글자만 가질 수 있는 변수가 완성되었군요.

function 함수(a : 'hello') : 1 | 0 | -1 {
  return 1 
}

함수('hello')

함수도 똑같습니다.
파라미터 타입선언할 때 글자나 숫자를 집어넣으시면 그 만 파라미터로 넣을 수 있고, return 타입선언할 때도 글자나 숫자를 집어넣으시면 그 값만 return할 수 있습니다.


[as const 문법]

var 자료 = {
  name : 'kim'
}

function 내함수(a : 'kim') {

}
내함수(자료.name)

kim' 이라는 타입만 들어올 수 있는 함수를 만들었습니다.
근데 자료.name을 입력하고 싶은겁니다.
그래서 코드를 이렇게 짜봤는데 위 코드는 에러가 납니다.

함수는 'kim' 타입만 입력할 수 있다고 해놨고
자료.name 이라는건 string 타입이지 'kim' 타입이 아니기 때문입니다.

해결하고 싶으면,
1. object 만들 때 타입을 잘 미리 정하든가
2. 예전에 배웠던 assertion을 쓰시든가 (as 'kim' 이런걸 붙이는 겁니다)
3. 아니면 as const 라는걸 애초에 object 자료에 붙일 수 있습니다.

var 자료 = {
  name : 'kim'
} as const;

function 내함수(a : 'kim') {

}
내함수(자료.name)

as const는 효과가 2개인데
1. 타입을 object의 value로 바꿔줍니다. (타입을 'kim'으로 바꿔줍니다)
2. object안에 있는 모든 속성을 readonly로 바꿔줍니다 (변경하면 에러나게)
object를 잠그고 싶으면 as const를 활용해보도록!

profile
꾸준함의 힘을 믿는 프론트엔드 개발자

0개의 댓글