[TypeScript] 열거형(Enum) 타입

열거형(Enum) 타입은 이름 그대로 여러 개의 값을 나열하는 용도로 사용한다. 자바스크립트에는 존재하지 않고 오직 타입스크립트에서만 사용할 수 있는 특별한 타입이다.

1. 숫자형 Enum (Numeric Enum)

가장 기본적인 형태의 Enum이다. 유저의 권한(Role)처럼 관련된 상수들의 집합을 정의할 때 유용하다.

1-1. 기본 자동 할당

별도로 값을 지정하지 않으면 0부터 1씩 증가하는 값이 자동으로 할당된다.

enum Role {
  ADMIN, // 0 할당 (자동)
  USER,  // 1 할당 (자동)
  GUEST, // 2 할당 (자동)
}

const user1 = {
  name: "탬니",
  role: Role.ADMIN, // 0
};

const user2 = {
  name: "홍길동",
  role: Role.USER, // 1
};

const user3 = {
  name: "아무개",
  role: Role.GUEST, // 2
};

이렇게 Enum을 사용하면 role: 0처럼 의미를 알 수 없는 숫자 대신 Role.ADMIN을 사용하여 코드의 가독성을 높일 수 있다.

1-2. 값 직접 할당 및 자동 증가

물론 0이 아닌 다른 숫자를 할당할 수도 있다. 시작하는 멤버에 값을 주면, 그 뒤의 멤버들은 자동으로 1씩 증가한다.

enum Role {
  ADMIN = 10, // 10 할당
  USER,       // 11 할당 (자동)
  GUEST,      // 12 할당 (자동)
}

물론 모든 멤버에 각각 다른 값을 직접 지정하는 것도 가능하다.

enum Role {
  ADMIN = 0,
  USER = 1,
  GUEST = 2,
}

2. 문자열 Enum (String Enum)

Enum의 멤버에는 숫자뿐만 아니라 문자열 값도 할당할 수 있다. 이를 문자열 Enum이라고 부른다.

enum Language {
  korean = "ko",
  english = "en",
}

const user1 = {
  name: "이정환",
  role: Role.ADMIN,
  language: Language.korean, // "ko"
};

왜 문자열 Enum을 쓸까?

문자열을 직접 타이핑하다 보면 오타가 발생할 수 있다. 예를 들어 "ko"라고 적어야 하는데 "kos", "KO-kr" 등으로 실수할 수 있는데, Enum을 사용하면 Language.korean처럼 자동 완성을 이용하므로 실수를 방지하고 코드를 안전하게 작성할 수 있다.

3. Enum은 컴파일되어도 사라지지 않는다

보통 타입스크립트의 타입(Type Alias, Interface 등)은 컴파일 시점에 모두 제거된다. 하지만 Enum은 컴파일 결과에 객체로 남는다.

컴파일 전 (TypeScript)

enum Role {
  ADMIN,
  USER,
  GUEST,
}

컴파일 후 (JavaScript)

var Role;
(function (Role) {
    Role[Role["ADMIN"] = 0] = "ADMIN";
    Role[Role["USER"] = 1] = "USER";
    Role[Role["GUEST"] = 2] = "GUEST";
})(Role || (Role = {}));

Enum은 내부적으로 자바스크립트 객체로 변환된다. 따라서 런타임(실행 중)에도 Role.ADMIN과 같이 값으로 접근하여 사용할 수 있다.

요약

Enum: 연관된 상수들을 모아놓은 타입으로 자바스크립트에는 없는 기능이다.
숫자형 Enum: 0부터 숫자가 자동 할당되며, 시작 값을 지정하면 1씩 자동 증가한다.
문자열 Enum: 의미 있는 문자열 값을 지정해 오타 방지 및 가독성을 높일 수 있다.
컴파일: 다른 타입들과 달리 컴파일 후에도 사라지지 않고 자바스크립트 객체로 남는다.

Taemni's Blog