[TypeScript 문법] TypeScript 열거형

TypeScript의 열거형 (Enum)

---

TypeScript의 열거형(Eumn)은 특정 값의 집합을 정의할 때 사용

• Javascript에서는 기본적으로 열거형을 지원하지 X
• TypeScript에서는 문자형 열겨형과 숫자형 열거형을 지원

다음과 같은 형태로 정의할 수 있음

enum Color {
  Red,
  Green,
  Blue,
}

위 예제는 Color라는 열거형을 정의하고 있음
➡️ 열거형의 값은 Red, Green, Blue

🔢 숫자형 열거형(Enum)

---

• 열거형은 숫자형과 문자열형, 혹은 이 둘의 조합으로 정의될 수 있음
• 디폴트 값으로 숫자형 사용, 각 값은 자동으로 0부터 시작하여 1씩 증가
• 다음과 같이 수동으로 값을 지정할 수도 있음

enum Color {
  Red = 1,
  Green = 2,
  Blue = 4,
}

열거형의 값에 대해 산술 연산을 수행할 수도 있음

enum Color {
  Red = 1,
  Green = 2,
  Blue = 4,
}
let c:Color = Color.Green;
let greenValue: number = Color.Green;
let blueValue: number = Color.Blue;

console.log(c); // 2
console.log(greenValue); // 2
console.log(blueValue); // 4

• 열거형은 일반적으로 상수값을 대신하여 사용 ➡️ 타입스크립트에서는 열거형이 많이 사용됨

🔠 문자형 열거형(Enum)

---

숫자형 열거형과 개념적으로 비슷하지만, 열거형의 값을 전부 다 특정 문자 또는 다른 열거형 값으로 초기화해야함

enum Direction {
  Up = "UP",
  Down = "DOWN",
  Left = "LEFT",
  Right = "RIGHT",
}
let myDirection: Direction = Direction.Up;
console.log(myDirection); // "UP" (대문자로 출력)

• Direction이라는 문자열 기반의 열거형(Enum)을 정의
• Up, Down, Left, Right 각각에는 대문자로 변경된 문자열 값이 할당
• myDirection 변수를 Direction.UP으로 초기화하고 있음

또한 문자형 열거형에는 (숫자형 열거형과는 다르게) auto-incrementing이 없음
➡️ 대신 디버깅을 할 때 숫자형 열거형의 값은 가끔 불명확하게 나올 때가 있지만, 문자형 열거형은 항상 명확한 값이 나옴


문자열 기반의 열거형은 주로 외부에서 가져온 값을 TypeScript에서 다루기 위해 사용
EX> HTTP 요청방식을 나타내는 열거형 정의

enum HTTPMethod {
  Get = "GET",
  Post = "POST",
  Put = "PUT",
  Delete = "DELETE",
}
function makeRequest(url: string, method: HTTPMethod) {
  // ...
}
makeRequest('/api/data', HttpMethod.Post);

위 코드에서는 HTTP 요청방식을 나타내는 HTTPMethod 열거형을 정의
makeRequest 함수는 URL과 HTTP 요청방식을 인자로 받음
HTTP 요청 방식을 지정할 때는 HTTPMethod.Post와 같이 열거형 값을 사용

역 매핑 ( Reverse mapping )

---

역매핑 ?

: 숫자형 열거형에만 존재하는 특징
➡️ 열거형의 키(key)로 값(value)을 얻을 수 있고 반대로, 값(value)으로 키(key)를 얻을 수도 있음

enum Enum {
  A
}
let a = Enum.A;
let nameOfA = Enum[a]; // "A"

키로 값을 얻을 수도 있고, 값으로 열거형의 키를 얻을 수도 있음
➡️ 숫자형 열거형에만 존재하며 문자열에는 존재하지 않음 !