[TypeScript] Literal types

Dorong·2022년 12월 23일
0

TypeScript

목록 보기
3/15

Literal type이란

  • 일반적인 방법보다 더 엄격한 타입지정
  • 타입을 만족하는 정해진 값만 들어오도록 함
  • 변수에 들어올 값을 더 엄격하게 관리할 수 있고 자동완성도 유용

✅ 예시

let coffee : 'americano';
coffee = 'americano';
coffee = latte;    // 다른 값 넣으면 오류!


✅ union type 형식으로도 가능

let coffee : 'americano' | 'latte';
coffee = 'americano';
coffee = 'latte';


✅ 함수에서도 사용가능

function sayHi(a : 'hi'):void{
    console.log(a);
}
sayHi('hi');



Literal type 주의점

let bow = {word : 'hello'}
function sayHello(bow : 'hello'):void{
    console.log(bow);
}
sayHello(bow.word)     // 오류!!

  • 분명 함수 파라미터의 리터럴 타입을 그대로 넣어주었지만 오류가 남
  • 사실 파라미터의 리터럴 타입의 의미는 값이 아닌 타입을 의미
  • 'hello'라는 값이 아닌 'hello'라는 타입을 요구!!

✅ 해결법

  1. 선언시 같은 리터럴 타입으로 맞춰주기

    let bow : {word : 'hello'} = {word : 'hello'};

  2. 함수 호출 시 파라미터에 Assertion 해주기

    sayHello(bow.word as 'hello');

  3. as const 키워드 사용하기
  • object value 값을 그대로 타입으로 지정해주고 readonly를 붙여주는 효과

    let bow = {word : 'hello'} as const;
    sayHello(bow.word);





🌟 잘못된 부분에 대한 말씀은 언제나 저에게 큰 도움이 됩니다. 🌟
👍 감사합니다!! 👍

profile
🥳믓진 개발자가 되겠어요🥳

0개의 댓글