[TypeScript]Literal Type과 const

만분의 일·2022년 8월 23일
0

TypeScript

목록 보기
6/7
post-thumbnail

Literal Type

변수에 원하는 값만 올 수 있게 할 때 사용한다.

let name: "kim";
name= "kim";
name= "park"; //error

let age: 10|20|30;
let age:10;
let age:40; //error

함수에서는 아래와 같이 사용가능하다.

함수 파라미터에 들어올 수 있는 자료가 적다면 Literal type으로 제한해 놓는 것이 유용하다.

function 함수(a:"hi"):1|0{ //literal 값으로 return값을 1과 0으로 정해놨기 때문에 1과 0만 return 할 수 있다.
	return 2 // error. 1과 0으로 정해놨기 때문에 
}
함수("hi")


✅ Quiz1. 다음과 같은 함수를 만들어 보세요

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

💻My Code
function game(x: "가위" | "바위" | "보"): ("가위" | "바위" | "보")[] {
  let answer = [x];
  return answer;
}

export {};



Literal Type 문제점과 해결 방법

var 자료={ name: "kim" } ;
function 함수(a: "kim") {}
함수(자료.name);

위 코드의 함수는 “kim”이라는 타입만 인자로 받는다. 변수 자료의 name 속성도 ‘kim’이 할당되었지만 왜 error가 발생할까?🤷‍♀️

이유는 변수 자료의 name 속성의 값이 ”kim”이지 type은 string이기 때문이다.

함수 파라미터의 타입은 “kim”이다.

a: “kim”파라미터 a에 “kim”이라는 type만 들어올 수 있다는 의미지

“kim”이라는 자료만 들어올 수 있다는 의미가 아니기 때문이다.

이런 이유로 error가 발생되는 것!

속성이란?
객체는 한꺼번에 여러 값을 담을 수 있는 통 (container)과 같은 자료구조(data structure)입니다.
객체 안에는 이름-값 쌍(name-value pair)이 저장되는데, 이것을 객체의 속성(property)라고 한다.


해결 방법1

객체(object)를 만들 때 타입 지정을 확실히 한다.

변수 자료에 name 속성에 대한 타입을 'kim'으로 지정한다.

이렇게 하면 자료.name의 타입은 “kim”이 된다.

var 자료:{name:"kim"}= { name: "kim" } 
function 함수(a: "kim") {}
함수(자료.name);
console.log(typeof(자료.name));

해결 방법2

as const로 타입 지정한다.

as const를 사용하면 literal type으로 지정된다.

즉, name속성 의 type을 name의 value값(”kim”)으로 변경해준다.

그리고 속성들에 모두 readonly가 설정된다.

따라서 readonly가 자동으로 부여되었기 때문에, name의 value값(”kim”)을 다른 값으로 변경하면 error가 뜬다

var 자료= { name: "kim" } as const
function 함수(a: "kim") {}
함수(자료.name);

내용 중 잘못된 부분이 있다면 댓글로 알려주신다면 감사하겠습니다!😊

profile
1/10000이 1이 될 때 까지

0개의 댓글