[코딩애플] ts part 1-7. Literal Types

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

Literal Types

• 변수에 뭐가 들어올지 더 엄격하게 관리 가능

예제1) 숫자

모든 숫자가 아니라

let 이름 :number;

숫자 123만 오도록 지정할 수 있다.

let 이름 :123;
이름 = 456; // 에러 발생

예제2) union type

예제를 더 보자. union type도 가능하다.

let 접니다 :'대머리' | '솔로';
접니다 = ''; // 에러 발생. 대머리 or 솔로만 들어올 수 있다.

예제3) 함수

함수도 되나 테스트해보자. 파라미터에 'hello'자료만 들어올 수 있다. return 값도 가능하다.

function 함수(a: 'hello') :1 | 0 {
    return 1; // or 0
}
함수('hello');

함수 파라미터에 들어오는 자료형이 몇 개 없다면, Literal types로 지정해주자.

Q. 이런 함수는 어떻게 만들죠

1. 가위 or 바위 or 보 중 1개 입력 가능
2. 가위 or 바위 or 보 만 들어올 수 있는 array를 return 해야 함

A.

function 가위바위보(입력 :'가위' | '바위' | '보') :('가위' | '바위' | '보')[] {
    
}
함수('가위'); // or 바위 or 보 만 가능.

const 변수의 한계

• 변하면 안되는 값을 넣는다 했다.
• 하지만 referencef data type으로 인해 object, array는 변경 가능하다.
• Literal type은 const 변수와 유사하게 사용 가능하다.
• 즉, **Literal type은 const 변수 업글버전**이다. 자료를 여러 개 저장할 수 있는 const 변수.

const 변수 = 'kim';
let 접니다 :'대머리' | '솔로';

Literal type의 문제점

var 자료 = {
    name: 'kim' // type: string
}
자료.name = 'kim';

function 내함수(a :'kim'){
    
}
내함수(자료.name); // 에러 발생. 

왜냐하면 a의 타입은 'kim'이다. 그래서 a에는 'kim'이라는 타입만 들어올 수 있다는 거다.

근데 자료.name은 type이 string이고 내용이 'kim'이다. 그래서 에러가 나고 안되는 거다.

솔루션

1. object 만들 때 타입지정 확실히 하기
2. as 문법으로 타입 구라치기(남용은 X)
3. **as const** 이상한 키워드 쓰기

as const

• **이 object는 literal type 지정 알아서 해주셈!**

효과1 - object value 값을 그대로 타입으로 지정해줌

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

그러면 이제 name은 'kim'타입(object value 값)이 된다!

효과2 - object 속성들에 모두 readonly 붙여줌

자료.name = 123; // 에러 발생. readonly만 가능

⭐즉, object 자료를 완전히 잠가놓고 싶으면 as const를 쓰자