Enum (열거형)

Enum은 여러 상수를 하나의 이름 아래 그룹화할 수 있는 타입스크립트 전용 기능이다.
자바스크립트에는 없는 개념이며, 상태나 방향처럼 정해진 값들의 집합을 표현할 때 자주 사용된다.

1. 기본 문법

기본적으로 숫자형 Enum은 첫 번째 값이 0부터 시작해 순차적으로 증가한다.

enum 이름 {
  상수1, // 0
  상수2, // 1
  상수3, // 2
}

Enum의 값은 꼭 0부터 시작할 필요가 없고, 임의의 숫자나 문자열로 시작할 수 있다.

enum Status {
  Success = 200,
  NotFound = 404,
  ServerError = 500,
}

2. 숫자형

값을 지정하지 않으면 자동으로 0부터 시작한다.

enum PlayerState {
  Buffering,
  Playing,
  Paused,
  Seeking,
}

let currentState: PlayerState;

currentState = PlayerState.Buffering;
currentState = PlayerState.Playing;

currentState = "Playing"; // 오류

// 메서드 생성
const isPlaying = (state: PlayerState) => {
  return state === PlayerState.Playing;
};

isPlaying(currentState); // true

역방향 매핑 (Reverse Mapping)

숫자형 Enum은 값으로 이름을 찾는 것도 가능하다. 이건 문자열 Enum에는 없는 특징이다.

enum PlayerState {
  Buffering,
  Playing,
  Paused,
}

console.log(PlayerState.Playing); // 1
console.log(PlayerState[1]); // "Playing"

3. 문자형

문자열 enum은 모든 값을 직접 초기화해야 한다.

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}

let direction: Direction = Direction.Up;
console.log(direction); // UP

• 문자열 Enum은 디버깅 시 값이 그대로 보이기 때문에 더 직관적이다.

예시: switch 문

Enum은 조건문에서 특히 가독성이 좋다.

enum Direction {
  Up,
  Down,
  Left,
  Right,
}

function move(direction: Direction) {
  switch (direction) {
    case Direction.Up:
      console.log("Moving up!");
      break;
    case Direction.Down:
      console.log("Moving down!");
      break;
    case Direction.Left:
      console.log("Moving left!");
      break;
    case Direction.Right:
      console.log("Moving right!");
      break;
  }
}

move(Direction.Up); // Moving up!

4. const enum (최적화 용도)

const enum은 컴파일 시점에 값으로 치환돼서 성능 최적화에 유리하다.
(다만 트리쉐이킹 문제 때문에 최근에는 잘 안 쓰인다고 한다.)

const enum Direction {
  Up,
  Down,
}

let d = Direction.Up;
// JS로 컴파일되면 그냥 let d = 0; 으로 변환됨

5. Enum vs Union Type

Enum도 좋지만, 상황에 따라 union literal type을 더 많이 쓴다고 한다!

// Enum
enum Direction {
  Up = "UP",
  Down = "DOWN",
}

// Union Literal
type Direction = "UP" | "DOWN";

정리

👩🏻‍💻 요약

• Enum은 상수 집합을 그룹화할 수 있는 타입스크립트 전용 기능
• 숫자형 Enum → 자동 증가, 역방향 매핑 가능
• 문자열 Enum → 값 직접 지정, 직관적
• const enum → 성능 최적화, 하지만 요즘은 덜 쓰임