TypeScript에서 열거형을 사용하는 방법 단계별

TypeScript의 열거형은 관련 값의 컬렉션을 나타내는 데 사용할 수 있는 명명된 상수 집합을 정의하는 방법입니다. 이러한 값에 친근한 이름을 지정하여 코드를 더 읽기 쉽고 유지 관리하기 쉽게 만듭니다. 이 가이드에서는 TypeScript에서 열거형을 단계별로 사용하는 방법을 안내하며, 열거형의 유형, 이점 및 실제 예를 다룹니다.

열거형이란 무엇인가요?

enum ("enumeration"의 약자)는 TypeScript의 특수 데이터 유형으로, 명명된 상수 집합을 정의할 수 있습니다. 이러한 명명된 상수는 숫자 또는 문자열 값을 나타낼 수 있으므로 코드가 더 설명적이고 오류가 덜 발생합니다.

TypeScript의 열거형 유형

TypeScript에는 세 가지 유형의 열거형이 있습니다.

숫자 열거형
문자열 열거형
이기종 열거형

숫자 열거형

숫자 열거형은 TypeScript의 기본입니다. 0부터 시작하거나 지정된 경우 사용자 지정 시작 값에서 자동으로 숫자 값이 할당되는 명명된 값의 집합입니다.

기본 숫자 열거형 예제

숫자 열거형의 간단한 예는 다음과 같습니다.

enum Direction {
  Up,
  Down,
  Left,
  Right
}

let move: Direction = Direction.Up;
console.log(move); // Output: 0

이 예에서 Direction 열거형에는 Up, Down, Left, Right의 네 가지 멤버가 있습니다. 기본적으로 Up에는 0 값이 할당되고, Down에는 1이 할당됩니다. 멤버에 사용자 지정 숫자 값을 지정할 수도 있습니다.

사용자 정의 값이 있는 숫자 열거형

열거형 멤버에 사용자 정의 값을 할당할 수 있습니다.

enum Status {
  New = 1,
  InProgress,
  Done = 5,
  Cancelled
}

console.log(Status.New); // Output: 1
console.log(Status.InProgress); // Output: 2
console.log(Status.Done); // Output: 5
console.log(Status.Cancelled); // Output: 6

이 예에서 New은 1으로 설정되고, InProgress은 자동으로 2으로 설정되고, Done은 5으로 설정되고, Cancelled은 자동으로 6으로 설정됩니다.

문자열 열거형

문자열 열거형은 각 멤버가 문자열 리터럴로 초기화되어 가독성이 더 높고 디버깅이 쉬운 또 다른 유형의 열거형입니다.

기본 문자열 열거형 예제

다음은 문자열 열거형의 예입니다.

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

let move: Direction = Direction.Left;
console.log(move); // Output: "LEFT"

이 예에서 각 열거형 멤버는 문자열 값으로 초기화됩니다. 숫자 열거형과 달리 문자열 열거형은 자동 증가 값이 없습니다.

이기종 열거형

이기종 열거형은 문자열과 숫자 멤버를 모두 포함하는 열거형입니다. 이를 정의하는 것은 가능하지만 일반적으로 권장되지 않습니다. 코드에서 혼란과 오류를 초래할 수 있기 때문입니다.

이기종 열거형 예제

이기종 열거형의 예는 다음과 같습니다.

enum MixedEnum {
  Yes = "YES",
  No = 0,
  Maybe = 1
}

console.log(MixedEnum.Yes); // Output: "YES"
console.log(MixedEnum.No); // Output: 0

이 예에서 MixedEnum에는 문자열과 숫자 값이 모두 포함됩니다. 이러한 열거형은 혼란을 일으킬 수 있으므로 신중하게 사용하십시오.

열거형 사용 사례

열거형은 다양한 시나리오에서 유용합니다.

방향(위, 아래, 왼쪽, 오른쪽)과 같은 관련된 상수의 집합을 나타냅니다.
상태 머신에서 상태 정의(신규, 진행 중, 완료, 취소됨).
가독성을 높이기 위해 switch-case 문에서 사용합니다.

Switch-Case 예제에서의 Enum

switch-case 문에서 열거형을 사용하면 코드 가독성이 향상되고 상태 관리가 더 쉬워집니다.

enum Status {
  New,
  InProgress,
  Done,
  Cancelled
}

function getStatusMessage(status: Status): string {
  switch (status) {
    case Status.New:
      return "The task is new.";
    case Status.InProgress:
      return "The task is in progress.";
    case Status.Done:
      return "The task is completed.";
    case Status.Cancelled:
      return "The task is cancelled.";
    default:
      return "Unknown status.";
  }
}

console.log(getStatusMessage(Status.InProgress)); // Output: "The task is in progress."

이 예제에서는 열거형을 사용함으로써 switch-case 문이 더 가독성이 좋고 오류가 발생할 가능성이 적습니다.

결론

TypeScript의 열거형은 명명된 상수 집합을 정의하는 강력한 방법을 제공하여 코드 가독성과 유형 안전성을 개선합니다. 숫자, 문자열 또는 이기종 열거형을 사용하면 코드를 더 잘 관리하고 구성할 수 있습니다. 이 단계별 가이드를 통해 이제 TypeScript에서 열거형을 사용하여 코드를 더 깔끔하고 유지 관리하기 쉽게 만드는 데 익숙해질 것입니다.

타입스크립트 열거형 상수 숫자형 문자열 이기종 값 명명됨 switch-case 사용 예제 가이드 초보자 코드