HTML&CSS&Javascript/TS

[Typescript] 열거형(enum) 타입에 관하여

킹우현 2023. 2. 24. 02:08

1) Typescript의 'enum' type이란 ?

enum Auth {
    admin = 0, // 관리자를 0으로 표현
    user = 1,  // 회원은 1로 표현
    guest = 2  // 게스트는 2로 표현
}

Typescript 는 JS의 기본 타입 외에도 몇 개의 타입을 더 제공하는데, 그 중 하나가 열거형이라고 불리는 enum 이다. 

 

enum은 말 그대로, 여러 값들에 미리 이름을 정의하여 열거해 두고 사용하는 타입이다.

 

2) enum을 사용하는 이유

2-1) 분야 별로 종류를 정의하여 명확하게 사용하기 위함

여러 값들을 분야 별로 정의할 수 있기 때문에, 의미를 명확하게 파악하고 사용할 수 있으며 코드의 가독성을 높일 수 있다.

 

2-2) 하드코딩의 실수를 줄이기 위함

하드코딩을 막고, 자동완성 기능을 사용할 수 있으며, 실수를 줄일 수 있다.

 

3) enum 사용법

1. enum은 기본으로 0부터 1씩 증가하는 값을 갖는다.

/*** 1. enum은 기본으로 0부터 1씩 증가하는 값을 갖는다. ***/

enum Auth {
    admin, // 0 : 별도로 값을 지정해주지 않으면 0부터 시작한다
    user,  // 1 : 이전 값에 1씩 더해진다.
    guest  // 2 : 이전 값에 1씩 더해진다.
}

console.log(Auth.admin);  // 0
console.log(Auth.user);   // 1
console.log(Auth.guest);  // 2

 

2. 숫자 값을 지정해줄 수 있다. 정의되지 않은 값은 이전 값에서 1씩 증가한다.

/*** 2. 숫자 값을 지정해줄 수 있다. 정의되지 않으면 이전 값에서 1씩 증가한다. ***/
enum Articles {
    notice = 100, // 값을 직접 지정 가능
    board = 300,  // 값을 직접 지정 가능
    comment       // 자동으로 앞의 300에 +1 더해줌 => 301
}

console.log(Articles.notice);  // 100
console.log(Articles.board);   // 300
console.log(Articles.comment); // 301

 

3. 문자열을 지정해 줄수 있다.

/*** 3. 문자열을 지정해 줄수 있다. ***/
enum Languages {
    korean = 'ko',
    english = 'en',
    japanese = 'jp',
    chiense = 'cn'
}

console.log(Languages.korean);   // "ko"
console.log(Languages.english);  // "en"
console.log(Languages.japanese); // "jp"
console.log(Languages.chiense);  // "cn"

 

4. JS 객체와의 차이점

1) enum은 한번 생성되면, 속성 추가 및 수정이 불가하다. 객체는 생성 이후에도 속성을 추가하고 변경할 수 있다.

2) enum은 속성 값으로 숫자, 문자열만 할당할 수 있다. 객체는 온갖 것을 다 넣을 수 있다.

- 즉, enum은 JS객체보다 더 엄격하게 타입을 정의하여 사용할 때 유용하다. (이게 타입스크립트를 사용하는 이유 중 하나이기도 하다)

 

( 출처 : https://curryyou.tistory.com/495 )

 

[TypeScript] enum 기초 사용법 (+ enum이 필요한 이유)

# TypeScript 의 enum 이란? Typescript 는 JS의 기본 타입 외에도 몇 개의 타입을 더 제공하는데, 그 중 하나가 열거형이라고 불리는 enum 이다. enum은 말 그대로, 여러 값들에 미리 이름을 정의하여 열거해

curryyou.tistory.com