TypeScript - 열거형: 초보자 가이드

안녕하세요, 미래의 프로그래머 여러분! 오늘은 TypeScript의 열거형(Enums)이라는 fascinling한 세상으로 함께 뛰어보겠습니다. 프로그래밍을 전혀 해보지 않았다면 걱정하지 마세요 - 저는 여러분의 친절한 안내자가 될 것입니다. 수년 동안 수많은 학생들을 가르친 경험을 바탕으로 여러분을 안내하겠습니다. 그럼 시작해보겠습니다!

TypeScript - Enums

열거형이란?

다양한 열거형의 종류에 들어가기 전에, 먼저 그것이 무엇인지 이해해보겠습니다. 가족의 옷장을 정리하는 것을 생각해보세요. 옷에는 다양한 카테고리가 있을 수 있습니다: 셔츠, 바지, 신발 등. TypeScript의 열거형은 이러한 카테고리와 같습니다 - 관련된 값을 함께 그룹화하고 의미 있는 이름을 부여하는 데 도움을 줍니다.

숫자 열거형

숫자 열거형은 TypeScript에서 가장 일반적인 열거형 유형입니다. 좋아하는 슈퍼 헴어에게 숫자를 할당하는 것과 같습니다.

enum Superheroes {
Superman,
Batman,
WonderWoman,
Flash
}

console.log(Superheroes.Superman);  // 출력: 0
console.log(Superheroes.Batman);    // 출력: 1
console.log(Superheroes.WonderWoman);  // 출력: 2
console.log(Superheroes.Flash);     // 출력: 3

이 예제에서 TypeScript는 자동으로 0부터 시작하는 숫자를 할당합니다. Superman은 0을 받고, Batman은 1을 받고 이어갑니다. 마치 그들이 단체 사진 촬영을 준비하고, 그들의 위치에 따라 숫자를 주는 것과 같습니다!

하지만 다른 숫자로 시작하고 싶다면 어떻게 하나요? 문제 없습니다! 그렇게 할 수도 있습니다:

enum Villains {
Joker = 1,
LexLuthor,
Cheetah,
ReverseFlash
}

console.log(Villains.Joker);        // 출력: 1
console.log(Villains.LexLuthor);    // 출력: 2
console.log(Villains.Cheetah);      // 출력: 3
console.log(Villains.ReverseFlash); // 출력: 4

여기서 우리는 Joker에게 1을 시작하게 하고, 나머지는 자동으로 계속합니다.

문자열 열거형

숫자가 아니라 단어를 좋아하신다면, 문자열 열거형이 유용합니다. 애완 동물의 이름을 주는 것과 같습니다!

enum PetNames {
Dog = "BUDDY",
Cat = "WHISKERS",
Fish = "BUBBLES",
Bird = "TWEETY"
}

console.log(PetNames.Dog);   // 출력: "BUDDY"
console.log(PetNames.Cat);   // 출력: "WHISKERS"
console.log(PetNames.Fish);  // 출력: "BUBBLES"
console.log(PetNames.Bird);  // 출력: "TWEETY"

문자열 열거형에서는 각 멤버에 값을 부여해야 합니다. 마치 각 애완 동물이 자신의 특별한 이름을 알고 있는 것과 같습니다!

혼합 열거형

occasionally, life isn't just numbers or just strings – it's a mix! Heterogeneous Enums are like a box of assorted chocolates – you get a bit of everything.

enum MixedBag {
Number = 1,
String = "STRING",
AnotherNumber = 2
}

console.log(MixedBag.Number);        // 출력: 1
console.log(MixedBag.String);        // 출력: "STRING"
console.log(MixedBag.AnotherNumber); // 출력: 2

이렇게 할 수 있지만, 일관성을 유지하기 위해 열거형 내에서 숫자 또는 문자열 중 하나만 사용하는 것이 일반적으로 권장됩니다.

실행 시간에 열거형

열거형의 멋진 점 중 하나는 실행 시간에 존재한다는 것입니다. 이는 코드에서 다른 객체처럼 사용할 수 있습니다!

enum Fruits {
Apple,
Banana,
Orange
}

function getFruitName(fruit: Fruits): string {
return Fruits[fruit];
}

console.log(getFruitName(Fruits.Apple));  // 출력: "Apple"
console.log(getFruitName(Fruits.Banana)); // 출력: "Banana"

여기서 우리는 열거형을 일반 JavaScript 객체처럼 사용하고 있습니다. 마치 숫자를 과일 이름으로 번역할 수 있는 마법의 사전처럼입니다!

컴파일 시간에 열거형

열거형은 컴파일 시간에도 빛을 발합니다. TypeScript는 코드가 실행되기 전에 오류를 찍을 수 있도록 도와줍니다!

enum DaysOfWeek {
Monday,
Tuesday,
Wednesday,
Thursday,
Friday,
Saturday,
Sunday
}

let day: DaysOfWeek = DaysOfWeek.Monday;
day = DaysOfWeek.Friday;  // 이는 괜찮습니다

// day = "Monday";  // 오류: Type '"Monday"' is not assignable to type 'DaysOfWeek'.

TypeScript는 열거형에 속하지 않는 값을 할당하려고 할 때 오류를 줍니다. 마치 클럽에서 주어진 요일만 허용하는 엄격한 보안원처럼입니다!

외부 열거형

외부 열거형은 특별한 경우입니다. 다른 코드나 라이브러리에서 사용되는 열거형에 대해 TypeScript에게 알리는 데 사용됩니다.

declare enum ExternalEnum {
A = 1,
B,
C = 2
}

declare 키워드는 "TypeScript야, 이 열거형이 다른 곳에 존재한다 믿어줘"라고 말하는 것과 같습니다. 이는 TypeScript가 아닌 코드와 함께 작업할 때 유용합니다.

객체 대신 열거형 사용

객체를 사용하는 것에 대해 고민할 수도 있습니다. 그러나 열거형은 몇 가지 장점을 가지고 있습니다:

// 객체 사용
const ColorObject = {
Red: 'RED',
Green: 'GREEN',
Blue: 'BLUE'
} as const;

// 열거형 사용
enum ColorEnum {
Red = 'RED',
Green = 'GREEN',
Blue = 'BLUE'
}

// 객체에서는 타입断정이 필요합니다
let objColor: keyof typeof ColorObject = 'Red';

// 열거형에서는 더 간단합니다
let enumColor: ColorEnum = ColorEnum.Red;

열거형은 더 나은 타입 안전성을 제공하고 많은 경우 더 간결합니다.

함수 매개변수로 열거형 사용

열거형은 함수 매개변수로 사용할 때도 매우 유용합니다. 코드가 더 읽기 쉽고 오류를 방지합니다:

enum Sizes {
Small,
Medium,
Large
}

function orderCoffee(size: Sizes): string {
switch(size) {
case Sizes.Small:
return "Here's your small coffee!";
case Sizes.Medium:
return "One medium coffee coming right up!";
case Sizes.Large:
return "Large coffee, extra caffeine!";
default:
return "We don't have that size!";
}
}

console.log(orderCoffee(Sizes.Medium));  // 출력: "One medium coffee coming right up!"
// console.log(orderCoffee("Venti"));    // 오류: Argument of type '"Venti"' is not assignable to parameter of type 'Sizes'.

사이즈 매개변수로 열거형을 사용하면, 只有有效的尺寸可以传递给函数。 마치 고정된 옵션으로 구성된 메뉴처럼 혼란스러움을 방지합니다!

열거형 메서드

열거형을 다루는 데 유용한 메서드 목록입니다:

메서드	설명	예제
`Object.keys()`	열거형의 모든 키를 가져옵니다	`Object.keys(Sizes)`
`Object.values()`	열거형의 모든 값을 가져옵니다	`Object.values(Sizes)`
`Object.entries()`	열거형의 키-값 쌍을 가져옵니다	`Object.entries(Sizes)`
`Enum[key]`	키에 대한 값을 가져옵니다	`Sizes[Sizes.Small]`
`Enum[value]`	값에 대한 키를 가져옵니다 (숫자 열거형에 대해)	`Sizes[0]`

이러한 메서드는 열거형을 다양한 방식으로 사용하는 데 도움이 됩니다. 예를 들어, 가능한 사이즈를 가져오거나 값을 기준으로 이름을 찾는 것입니다.

그럼으로써! TypeScript 열거형의 세계로 첫 걸음을 뗐습니다. 프로그래밍은 새로운 언어를 배우는 것과 같아서, 연습이 필요합니다. 하지만 곧 열거형을 자유자재로 사용할 수 있을 것입니다. 계속 코딩하고, 호기심을 유지하며, 과정에서 즐거움을 느껴보세요. 누가 알겠는가, maybe you'll create an Enum for your favorite ice cream flavors next!

Credits: Image by storyset