열거형(Enum) 타입

Enum은 특정 값들의 집합을 정의할 때 사용합니다. Enum은 다음과 같은 경우에 유용하게 사용됩니다.

특정 값들을 어떤 집합으로 나타낼 수 있을 때
특정 값들의 집합을 이름으로 접근하고 싶을 때

예를 들어, 요일을 나타내는 Enum 타입을 만들어보겠습니다.

enum Weekday {
  Monday,
  Tuesday,
  Wednesday,
  Thursday,
  Friday,
  Saturday,
  Sunday,
}

let today: Weekday = Weekday.Monday;
today = /* 자동완성으로 값을 할당해보세요. */

👉 TS Playground에서 타입스크립트 컴파일러의 동작을 직접 확인해보세요.

Enum은 다른 타입스크립트 문법과 다르게 컴파일 된 후, 자바스크립트 코드에 남아있습니다. 위 코드는 다음과 같이 컴파일 됩니다.

var Weekday;
(function (Weekday) {
  Weekday[(Weekday["Monday"] = 0)] = "Monday";
  Weekday[(Weekday["Tuesday"] = 1)] = "Tuesday";
  Weekday[(Weekday["Wednesday"] = 2)] = "Wednesday";
  Weekday[(Weekday["Thursday"] = 3)] = "Thursday";
  Weekday[(Weekday["Friday"] = 4)] = "Friday";
  Weekday[(Weekday["Saturday"] = 5)] = "Saturday";
  Weekday[(Weekday["Sunday"] = 6)] = "Sunday";
})(Weekday || (Weekday = {}));
let today = Weekday.Monday;
today = Weekday.Friday;

이는 곧 Enum은 값이라는 것을 의미합니다. 그렇기에 실제 타입스크립트 코드 상에서부터 let today: Weekday = Weekday.Monday;와 같은 방식으로 사용할 수 있는 것입니다. Enum인 Weekday가 값(객체)인 것처럼, Weekday.Monday도 값입니다.

Enum에 속한 값들은 명시적으로 지정하지 않으면 기본적으로 number 값이며 0부터 시작하여 1씩 증가합니다.

enum Weekday {
  Monday, // 0
  Tuesday, // 1
  Wednesday, // 2
  Thursday, // 3
  Friday, // 4
  Saturday, // 5
  Sunday, // 6
}

console.log(Weekday.Sunday); // 6

👉 TS Playground에서 타입스크립트 컴파일러의 동작을 직접 확인해보세요.

만약 Monday에 1을 할당하면, 1부터 시작하여 1씩 증가합니다.

enum Weekday {
  Monday = 1,
  Tuesday, // 2
  Wednesday, // 3
  Thursday, // 4
  Friday, // 5
  Saturday, // 6
  Sunday, // 7
}

console.log(Weekday.Sunday); // 7

👉 TS Playground에서 타입스크립트 컴파일러의 동작을 직접 확인해보세요.

Enum은 문자열 값으로 초기화할 수도 있습니다.

enum Weekday {
  Monday = "Monday",
  Tuesday = "Tuesday",
  Wednesday = "Wednesday",
  Thursday = "Thursday",
  Friday = "Friday",
  Saturday = "Saturday",
  Sunday = "Sunday",
}

console.log(Weekday.Sunday); // "Sunday"

👉 TS Playground에서 타입스크립트 컴파일러의 동작을 직접 확인해보세요.

Enum과 Union 타입

특정한 값들의 집합이라는 측면에서 Union 타입은 Enum과 유사한 역할을 할 수 있습니다.

type Weekday =
  | "Monday"
  | "Tuesday"
  | "Wednesday"
  | "Thursday"
  | "Friday"
  | "Saturday"
  | "Sunday";

let today: Weekday = 'Monday';
today = /* 자동완성으로 값을 할당해보세요. */

👉 TS Playground에서 타입스크립트 컴파일러의 동작을 직접 확인해보세요.

Enum과 Union 타입의 차이는 Enum은 컴파일 후에도 남아 자바스크립트 코드에 실제로 존재하는 값이 되고, Union 타입은 컴파일 후에는 사라집니다.

저는 개인적으로 Enum 보다는 Union 타입을 사용하는 것을 선호합니다(근래에 Enum을 쓴 적이 없습니다). 첫번째는 자동완성 측면에서 Union 타입은 한번으로 자동완성이 되는 반면, Enum은 Enum의 이름을 먼저 친 후 .을 찍어야 원하는 실제 값으로 자동완성이 되기 때문이고, 두번째는 런타임에 존재하는 Enum의 특성을 잘 활용해 코드를 작성한 케이스가 없기 때문에 런타임 환경에 존재할 Enum 값을 만들 필요성을 느끼지 못하기 때문입니다. 만약 Enum의 특성이 효과적으로 사용될 수 있는 케이스가 있다면 Enum을 사용할 것 같지만 아직 저는 맞이 한 적은 없습니다.