작업 방법에 대한 가이드

TypeScript는 자바스크립트의 확장된 형태로, 코드 작성 시 타입 안정성을 높여줍니다.

TypeScript를 사용함으로써, 개발 과정 초기에 버그를 발견하고 수정하는 것이 가능해집니다. TypeScript의 주요 기능 중 하나는 열거형(Enum)입니다. 열거형은 TypeScript에서 안전한 코드 작성을 지원하는 데 널리 사용되는 구조입니다.

이 글에서는 열거형의 개념과 생성 및 사용 방법, 그리고 추가적으로 고려해야 할 사항들에 대해 알아보겠습니다.

열거형이란 무엇인가?

열거형(Enum)은 'enumeration'의 줄임말입니다. 열거형 데이터 타입은 해당 타입의 변수가 가질 수 있는 여러 가능한 값들을 정의합니다. 이러한 값들은 흔히 멤버 또는 요소라고 불립니다.

여기서는 '멤버'라는 용어를 사용하겠습니다. 열거형은 TypeScript만의 기능이 아니라, 다른 프로그래밍 언어에서도 사용되는 타입입니다. 열거형을 통해 TypeScript 프로그램의 타입 안정성을 향상시킬 수 있습니다.

참고 자료: 개발자가 알아야 할 유용한 TypeScript 라이브러리 및 런타임

왜 열거형을 사용해야 할까요?

열거형은 변수가 가질 수 있는 값의 범위를 명확하게 지정하는 데 도움을 줍니다. 또한 함수의 인자로 전달될 수 있는 값의 종류를 정의하는 데에도 유용합니다. 이를 통해 개발자는 변수나 함수 인수에 항상 예상되는 값을 제공할 수 있게 됩니다. 결과적으로 버그 발생 가능성을 줄이고, 더욱 안전하고 견고한 코드를 작성할 수 있습니다.

열거형 사용을 위한 준비 사항

이 튜토리얼에서는 TypeScript에서 열거형을 사용하는 방법을 살펴볼 것입니다. 튜토리얼을 따라하기 위해서는 TypeScript 코드를 실행할 수 있는 환경이 필요합니다.

JavaScript 코드를 실행하기 위해서는 Node.js가 필요합니다. TypeScript가 아직 설치되어 있지 않다면, 다음 자료를 참고하여 설치하십시오.

또는, ts-node를 사용하여 스크립트를 즉시 컴파일하고 실행할 수 있습니다. 이 글에서는 ts-node를 사용하지만, 대규모 프로젝트에서는 TypeScript를 설치하는 것을 권장합니다. ts-node를 사용하여 스크립트를 실행하려면 다음 명령을 사용합니다:

npx ts-node <스크립트_이름>

또한, 이 글에서는 독자가 JavaScript와 기본적인 TypeScript 지식을 가지고 있다고 가정합니다.

간단한 열거형 사용법

간단한 열거형 생성 방법

TypeScript에서 열거형은 enum 키워드를 사용하여 생성됩니다. 열거형의 이름 뒤에 멤버 목록을 나열합니다. 다음은 나침반의 네 가지 기본 방향에 대한 열거형 선언 예시입니다:

enum Direction {
    North,
    East,
    South,
    West
}

열거형의 멤버는 문자열이 아니므로 따옴표로 묶지 않습니다.

간단한 열거형 사용 방법

다음과 같이 변수에 열거형 값을 할당할 수 있습니다:

const heading: Direction = Direction.North;

변수 선언 시 값을 할당하므로, TypeScript는 데이터 타입을 추론할 수 있습니다. 따라서 다음과 같이 타입을 명시하지 않아도 됩니다:

const heading = Direction.North;

heading 변수의 값을 확인하려면 console.log를 사용하면 됩니다:

console.log(heading);

결과는 다음과 같습니다:

0

heading 변수에 Direction.North 값을 할당했지만, 실제로는 값 0이 저장됩니다. 이는 열거형이 생성될 때 각 멤버에 숫자 값이 할당되기 때문입니다. 첫 번째 멤버에는 0이 할당되고, 두 번째 멤버에는 1이 할당되는 방식입니다. 아래는 예시입니다:

console.log(Direction.North, Direction.East, Direction.South, Direction.West)

따라서 heading 변수에 북쪽이 0이라는 것을 이용하여, 북쪽을 포함하고 있는지 확인할 수 있습니다. 예를 들면 다음과 같습니다:

// 동등성 확인
let isNorth = heading == 0;

// 결과 출력
console.log(isNorth);

위에서 설명했듯이 Direction.North는 0과 같습니다. 따라서 방향이 0인지 확인하는 대신 Direction.North와 같은지 확인할 수 있습니다:

// 방향이 북쪽인지 확인
isNorth = heading == Direction.North;

// 결과 출력
console.log(isNorth);

이러한 방식은 유용합니다. 열거된 값을 사용하는 일반적인 방법일 것입니다. 그러나 더 많은 기능이 있습니다. 다음 섹션에서는 사용자 지정 값을 사용하는 방법에 대해 알아보겠습니다.

사용자 정의 값 사용

열거형을 생성하면 TypeScript는 0부터 시작하여 각 멤버에 숫자 값을 자동으로 할당합니다. 하지만 멤버에 기본값 대신 사용자 정의 값을 부여할 수도 있습니다. 이 경우 해당 값을 명시적으로 할당해야 합니다. 다음 예시를 참고하세요:

enum StarRating {
    VeryPoor = 1,
    Poor = 2,
    Average = 3,
    Good = 4,
    Excellent = 5
}

또는 다음과 같이 할 수도 있습니다:

enum StarRating {
    VeryPoor = 1,
    Poor,
    Average,
    Good,
    Excellent
}

이 경우에는 첫 번째 멤버에 1이 할당됩니다. 이어지는 멤버는 이전 값에서 자동으로 1씩 증가합니다. 즉, Poor는 2, Average는 3 등으로 평가됩니다.

나중에 살펴보겠지만 열거형의 선택 사항이 항상 숫자 값을 갖는 것은 아닙니다. 그러나 숫자 값을 갖는 멤버는 일반 숫자처럼 작동합니다.

console.log(typeof StarRating.Average);

위 코드를 실행하면 "number"가 출력됩니다. 즉, 비교 연산을 포함한 모든 숫자 관련 작업을 수행할 수 있다는 의미입니다.

console.log(StarRating.Excellent > StarRating.Average)

위 코드를 실행하면 "true"가 출력됩니다.

문자열을 사용자 정의 값으로 사용

앞서 언급했듯이 열거형 멤버는 숫자 외에도 문자열 값을 가질 수 있습니다. 다음과 같이 설정할 수 있습니다:

enum Choice {
    RedPill = "모든 것을 알게 됨",
    BluePill = "아무것도 모름"
}

이 경우 열거형 멤버는 이전 예시와 유사하게 작동합니다. 다만 값이 문자열이므로 숫자 연산 대신 문자열 연산을 수행할 수 있습니다.

혼합형 열거형

문자열과 숫자 값을 혼합해서 사용할 수도 있습니다. 권장되는 방법은 아니며 유용성도 떨어지지만, 가능은 합니다.

enum Mixed {
    First = "문자열",
    Second = 2
}

마무리

이 글에서는 TypeScript의 열거형이 무엇인지, 왜 중요한지에 대해 알아보았습니다. 또한 열거형 멤버가 가질 수 있는 다양한 값의 종류에 대해서도 다루었습니다.

다음에는 TypeScript의 타입과 인터페이스에 대한 글을 확인해 보시기 바랍니다.