[Typescript] 11. 열거형
포스트
취소

[Typescript] 11. 열거형

Enum

개요

프로그래밍을 배우다보면 Enumeration 자료형에 대해서 들어본 적이 있을 것이다.
일정 범위 안에 들어오는 값만을 고를 수 있는 자료형으로, 열거형이라고 부른다. 아래 예제를 보자.

1
2
3
4
5
const paint = (brush) => {
  if (brush === 'square') return console.log('square');
  if (brush === 'circle') return console.log('circle');
  return console.log('nothing');
};

그림판에서 brush의 모양에 따라 그려지는 방식을 다르게 한다고 하면 위와 같이 구현이 가능할 것이다.
하지만 매개변수의 brush의 값은 square circle 둘 중 하나여야만 정상적으로 동작한다. 물론 그 외 값이 들어와도 nothing 처리를 해뒀기 때문에 에러는 나지 않지만 nothing이 표시가 되는 일은 없어야 한다.

그럴 때 열거형을 사용할 수 있다.

1
2
3
4
5
6
7
8
9
10
const enum BrushType = {
  SQUARE = 'square',
  CIRCLE = 'circle',
};

const paint = (brush: BrushType) => {
  // ...
};

paint(BrushType.SQUARE); // paint('square');

enum 키워드로 열거형을 선언할 수 있으며, type처럼 사용할 수 있다.

Value가 없는 열거형

만약 enum객체를 선언할 때 굳이 value를 지정해주지 않아도 될 상황이 있다.
어차피 enum만 허용할건데 enum을 대표하는 value들을 지정해 줄 필요는 없기 때문이다.

1
2
3
4
5
6
7
8
9
10
11
12
13
const enum BrushType {
  CIRCLE, // 0
  SQUARE, // 1
};

const draw = (brush: BrushType) => {
  if (brush === BrushType.CIRCLE) return console.log('Circle');
  if (brush == BrushType.SQUARE) return console.log('Square');
  return console.log('Nothing!');
};

draw(BrushType.CIRCLE);
draw('Hello'); // Error

위와 같은 방법으로 사용할 수 있다.

Type Union을 이용한 Enum

그런데 몇가지 되지도 않는 선택지 때문에 enum 객체를 선언하기 애매한 상황이라면 다음과 같은 선택지도 존재한다.

1
2
3
4
5
const paint = (brush: 'square' | 'circle') => {
  if (brush === 'square') return console.log('square');
  if (brush === 'circle') return console.log('circle');
  return console.log('nothing');
};

'square' | 'circle'와 같은 방식으로 유효 범위를 지정하여 Type을 간단하게 만들 수 있다.

이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.