[Refactor] as const 선언 -> 상수로 수정

[jhj2713]

🖥️ Preview

close #187

✏️ 한 일

• as const 선언 -> 상수로 수정

❗️ 발생한 이슈 (해결 방안)

enum

as const로 상수를 선언해서 불필요한 타입 정의가 많아지는 경향이 있었습니다.

as-is

export const enum OPTION_POSITION {
    LEFT = "LEFT",
    RIGHT = "RIGHT",
}

type RushOptionPositionType = (typeof OPTION_POSITION)[keyof typeof OPTION_POSITION];

export interface RushOptionType {
    optionId: number;
    mainText: string;
    subText: string;
    resultMainText: string;
    resultSubText: string;
    imageUrl: string;
    position: RushOptionPositionType;
}

to-be

export const enum OPTION_POSITION {
    LEFT = "LEFT",
    RIGHT = "RIGHT",
}

export interface RushOptionType {
    optionId: number;
    mainText: string;
    subText: string;
    resultMainText: string;
    resultSubText: string;
    imageUrl: string;
    position: OPTION_POSITION;
}

enum은 typescript 자체 문법으로, javascript로 컴파일될 때 즉시 실행함수로 변환이 되면서 Tree-shaking이 안된다는 단점이 있습니다.
참고자료

const enum

따라서 enum�대신 const enum을 사용했습니다.

const enum의 경우 enum과 유사하게 열거형으로 사용되는 타입입니다. 하지만 enum과는 달리 javascript로 컴파일 될 때 즉시 실행 함수가 아니라 상수 값으로 치환되어서 tree shaking의 문제가 없습니다.

const enum의 문제점

export const enum CARD_COLOR {
    BLUE = "blue",
    RED = "red",
    YELLOW = "yellow",
    GREEN = "green",
}

const colors = Object.values(CARD_COLOR);

const enum을 사용하는 경우 위 상황에서 오류가 발생하는데, enum은 숫자형 열거형일 경우 값에서 키를, 키에서 값을 참조할 수 있는 양방향 매핑을 제공하지만 const enum은 양방향 매핑을 제공하지 않기 때문입니다.

결국 이렇게 값을 참조해야하는 경우에는 const enum을 사용할 수 없어서 enum을 사용해야합니다.

❓ 논의가 필요한 사항

[github-actions]

빌드를 성공했습니다! 🎉

[github-actions]

빌드를 성공했습니다! 🎉

[sooyeoniya]

확인했습니다:) 붙이고 제 쪽에서두 마저 반영할게용!