TypeScript Study Note

Ginie·2021년 1월 17일
0

TypeScript

목록 보기
8/11
post-thumbnail

리터럴 타입 좁히기

  • 무한한 수의 잠재적 케이스들 (문자열 값은 경우의 수가 무한대)을 유한한 수의 잠재적 케이스 (helloWorld의 경우: 1개)로 줄여나가는 것을 타입 좁히기(narrowing)라 한다.
// const를 사용하여 변수 helloWorld가
// 절대 변경되지 않음을 보장합니다.

// 따라서, TypeScript는 문자열이 아닌 "Hello World"로 타입을 정합니다.
const helloWorld = "Hello World";

// 반면, let은 변경될 수 있으므로 컴파일러는 문자열이라고 선언할 것입니다.
let hiWorld = "Hi World";

문자열 리터럴 타입

  • 문자열 리터럴 타입은 유니언 타입, 타입 가드, 타입 별칭과 잘 결합 된다. 함께 사용해서 문자열로 enum(열거) 과 비슷한 형태를 갖출 수 있다.
  • 문자열 리터럴 타입은 오버로드를 구별하는 것과 동일한 방법으로 사용될 수 있다.
type Easing = 'ease-in' | 'ease-out' | 'ease-in-out';

class UIElement {
    animate(dx: number, dy: number, easing: Easing) {
        if (easing === 'ease-in') {

        } else if (easing === 'ease-out') {

        } else if (easing === 'ease-in-out') {

        } else {
            //타입을 무시하면 이곳에 도달 가능하다.
        }
    }
}

let button = new UIElement();
button.animate(0, 0, 'ease-in')
button.animate(0, 0, 'uneasy'); // 허용되지 않은 문자열이 사용 되면 오류가 발생한다.

숫자형 리터럴 타입

  • 설정값을 설명할 때 사용됨.
declare function setupMap(config: MapConfig): void;
interface MapConfig {
    lng: number;
    lat: number;
    tileSize: 8 | 16 | 32;
}
setupMap({ lng: -73.935242, lat: 40.73061, tileSize: 16 });
profile
느리지만 꾸준한 프론트엔드 주니어 개발자 🐢

0개의 댓글