[TypeScript] 이넘 (Enums)

 

타입스크립트의 이넘에 대해서 알아보자!

 

 

---

 

 

 1. 이넘(Enum) 이란? 

 

이넘: 특정 값들의 집합을 의미하는 자료형

 

- 프로그래밍 언어에서 사용되는 데이터 유형(Data Type) 중 하나
- 명명된 상수(named constants)의 집합을 정의하는 데 사용
- 일반적으로 코드를 읽고 이해하기 쉽도록 특정 값들에 이름을 지정하여 사용하는데 유용

 

 

---

 

 

 2. 이넘의 장점 

 

-   명명된 상수  : 이넘을 사용하면 각각의 상수에 이름을 지정할 수 있다. → 가독성을 향상, 코드의 의도를 명확히 전달

-   유연성과 확장성  : 이넘을 사용하면 프로그램에서 사용되는 값들을 한 곳에 집중시켜 정의할 수 있다. 이는 만약 값이 변경되어야 할 경우, 해당 이넘만 수정하면 되기 때문에 변경에 대한 유연성과 확장성을 제공한다. → 변경이 필요한 범위가 줄어든다. 

-  고정된 값 집합  : 이넘은 정의된 상수 집합 중 하나의 값만 가질 수 있다. → 프로그램에서 사용되는 값들을 제한하고, 유효한 값의 범위를 제어하는 데 도움이 된다.

-   타입 안전성  : 이넘을 사용하면 컴파일러가 타입 안전성을 제공하여 잘못된 상수 사용을 방지할 수 있다. 즉, 잘못된 형식의 상수를 사용하려고 시도할 때 컴파일러가 오류를 발생시킨다.

-   이넘에 대한 메서드 지원  : 이넘은 각 상수에 대해 메서드를 정의할 수 있다. 이를 통해 각 상수에 특정한 동작을 수행하도록 지정할 수 있다.

-   이넘 값 순회  : 이넘은 주어진 상수 집합을 순회할 수 있는 기능을 제공한다. 이를 통해 반복문 등을 사용하여 이넘의 모든 값에 접근할 수 있다.

-   IDE의 적극적인 지원  : IDE(통합 개발 환경)는 개발자가 소프트웨어를 개발하는 데 사용되는 소프트웨어 응용 프로그램이다. IDE는 코드 편집기, 디버거, 컴파일러, 빌더, 프로젝트 관리 도구 등을 포함하여 개발자가 효율적으로 개발 작업을 수행할 수 있도록 지원한다.
IDE는 코드 작성 중에 이넘을 자동으로 완성하고, 이넘을 사용하는 코드를 더 쉽게 탐색하고 관리할 수 있는 기능을 제공할 수 있다. 한 IDE는 실시간 오류 검사를 통해 이넘 사용 시 발생할 수 있는 오류를 미리 감지하여 수정할 수 있도록 도와준다.

 

 

---

 

 

 3. 이넘의 종류 

 

 타입스크립트에서는 문자형 이넘과 숫자형 이넘을 지원한다.

 

 

 1) 숫자형 이넘 

 

enum DirectionNumberWithNumber {
  UP = 0,
  DONW = 1,
  RIGHT = 2,
  LEFT = 3,
}

 

숫자형 타입에서는 value의 할당 (=초기화)을 생략할 수도 있다.
할당을 생략하게 되면 값은 0 부터 차례대로 할당된다.

enum Shoes {
  Nike, // 0
  Adidas, // 1 
}

let myShoes = Shoes.Nike;
console.log(myShoes);  // 0   -> 이넘을 쓸 때, 별도의 값을 지정하지않으면 전부 다 숫자형 이넘으로 취급함

 

만약 아래와 같이 숫자형 이넘을 선언할 때 초기 값을 주면 초기 값부터 차례로 1씩 증가한다. ( auto-incrementing)

enum Direction {
  Up = 1,
  Down,  // 2
  Left,  // 3
  Right  // 4
}

 

 

 

 2) 문자형 이넘 

 

문자형 이넘은 이넘 값 전부 다 특정 문자 또는 다른 이넘 값으로 초기화 해줘야 한다.
그리고 문자형 이넘에는 숫자형 이넘과는 다르게 auto-incrementing이 없다.

enum Shoes {
  Nike = "나이키", 
  Adidas = "아디다스", 
}

let myShoes = Shoes.Nike;
console.log(myShoes);  // "나이키"

 

 

---

 

 

 4. 이넘 활용 사례 

 

 

 1) 숫자형 이넘 사용 

 

enum Response {
  No = 0,
  Yes = 1,
}

function respond(recipient: string, message: Response): void {
  // ...
}

respond("Captain Pangyo", Response.Yes);

 

Response.Yes는 이넘 Response에 정의된 상수 중 하나이다. 
0부터 시작하여 순서대로 값을 할당해서 Response.Yes는 숫자 값 1을 가지게 된다.
이러한 이넘을 사용하는 이유는 가독성과 유지보수성을 높이기 위함이다.
코드에서 숫자 값 대신에 의미 있는 이름을 사용하면 코드를 이해하기 쉽고 실수를 줄일 수 있다. 
또한, 만약 상수 값이 변경되어야 할 경우에는 이넘의 정의만 수정하면 되므로 코드를 유지보수하기가 더 쉬워진다.

 

 

 

 2) 문자형 이넘 사용 

 

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

 

위의 코드에서는 Direction이라는 이넘을 정의하고 있다.
이 이넘은 Up, Down, Left, Right라는4가지의 상수를 포함하고 있다.
TypeScript는 기본적으로 이넘의 첫 번째 상수에 0을 할당하고, 이후에는 1씩 증가된 값을 할당한다.
따라서 Direction.Right는 숫자 값 3을 가지게 된다. 
Direction.Right를 통해 "오른쪽"을 나타낼 수 있으며, 숫자 값 3을 직접 사용하는 것보다 코드를 이해하기가 더 쉬워진다. 

 

 

 3) 복합 이넘 사용 

 

기술적으로 이넘에 문자와 숫자를 혼합하여 생성할 순 있지만, 이 방식을 권고하진 않는다.
최대한 같은 타입으로 이루어진 이넘을 사용해야한다.

enum BooleanLikeHeterogeneousEnum {
    No = 0,
    Yes = "YES",
}

 

 

---

 

 

 5. 이넘의 특징 

 

 1) 같은  enum내에서는 같은 키값을 사용할 수가 없다. 

enum test {
  a: string,
  a: string, // error
}

 

 

 2)  enum은 선언적 할당을 이용해 확장할 수 있다. 

enum DirectionNumber {
  UP,
  DONW,
  RIGHT,
  LEFT,
}

enum DirectionNumber {
  CENTER = 5,
}

console.log(DirectionNumber)

/*
{
  '0': 'UP',
  '1': 'DONW',
  '2': 'RIGHT',
  '3': 'LEFT',
  '5': 'CENTER',
  UP: 0,
  DONW: 1,
  RIGHT: 2,
  LEFT: 3,
  CENTER: 5
}
*/

 

 

 3) 기존의 키 값에 존재하지 않는 키값을 추가해줄순 있지만 원래 enum의 역할은 할수가 없다. 

enum DirectionNumber {
  UP,
  DONW,
  RIGHT,
  LEFT,
}

DirectionNumber["CENTER"] = 5

console.log(DirectionNumber.CENTER) // error

 

 

 4) 선언이후에 값을 변경할수는 없다. 

enum DirectionNumber {
  UP,
  DONW,
  RIGHT,
  LEFT,
}

enum DirectionNumber["UP"] = 5  // error

 

 

---

 

 

 6. 객체와의 차이 

 

 1) 객체와 이넘 코드 비교 

 

객체

let Direction {
  Up : 0,
  Down: 1,
  Left: 2,
  Right: 3,

 

이넘

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

 

위의 객체와 같이 쓰면 친숙하고 편한데, 이넘이 객체와 비교했을 때 무슨 장점이 있길래 굳이 이넘을 쓰는걸까? 이유는 아래에서 볼 수 있다.

 

 

 2) 이넘을 쓰는 이유 (객체와의 차이점) 

 

- 가독성과 유지보수성: 이넘을 사용하면, 상수에 의미 있는 이름을 지정할 수 있어서 코드의 이해도와 가독성을 높일 수 있다. 또한, 코드 전체에서 사용되는 상수 값을 한 곳에서 관리할 수 있어 유지보수성이 향상된다. 

 

- 자동 할당 및 증가된 값: 이넘은 기본적으로 첫 번째 상수에 0을 할당하고, 이후 상수에는 자동으로 증가된 값을 할당한다. 이를 통해 개발자가 숫자 값을 직접 정의하거나 관리할 필요가 없어진다.

 

- 타입 안정성(Type Safety): 이넘은 타입 안정성을 제공하여 잘못된 상수 사용을 방지한다. TypeScript 컴파일러는 이넘에 해당하는 값만 허용하도록 체크하여 오류를 미리 방지합니다.

 

- 자동 완성과 IntelliSense: IDE에서 이넘을 사용하면 자동 완성과 IntelliSense 기능을 활용할 수 있다. 이를 통해 개발자는 가능한 상수 값을 빠르게 확인하고 사용할 수 있다.

 

 3) 이넘과 객체 사용 시 차이점 

 

- 객체는 코드내에서 새로운 속성을 자유롭게 추가할 수 있지만, 이넘은 선언할때 이후에 변경할 수 없다.
- 객체의 속성값은 JS가 허용하는 모든 타입이 올 수 있지만, 이넘의 속성값으로는 문자열 혹은 숫자만 허용된다.