코딩/한 입 크기로 잘라먹는 타입스크립트

[TypeScript] 열거형(Enum) 타입

김기지 2023. 7. 2. 23:08

🥑 열거형(Enum) 타입

타입스크립트에서만 사용할 수 있는 여러가지 값들에 각각 이름을 부여해 열거해두고 사용하는 타입

열거형 타입은 여러개의 값을 나열하는 용도로 사용된다.

 

🎈 사용하기

enum 타입을 사용하면 역활과 같은 값을 분류할 경우 헷갈리지 않도록 분류할 수 있다.
const user1 = {
    name : '김기지',
    role : 0 // 0 <- 관리자
}

const user2 = {
    name : '강백호',
    role : 1 // 1 <- 일반 유저
}

const user3 = {
    name : '소형준',
    role : 2 // 2 <- 게스트
}

위와 같이 유저의 정보를 담은 변수를 작성할 때 enum 타입을 사용해보자

 

// enum 키워드를 사용하여 설정
//타입 별칭과는 다르게 '='을 사용하지 않음
enum Role {
    ADMIN = 0,
    USER = 1,
    GUEST = 2,
}
const user1 = {
    name : '김기지',
    role : Role.ADMIN // 0 <- 관리자
}

const user2 = {
    name : '강백호',
    role : Role.USER // 1 <- 일반 유저
}

const user3 = {
    name : '소형준',
    role : Role.GUEST // 2 <- 게스트
}

 

 

  1. enum 키워드로 선언을 한 후
  2. 명명을 해준 뒤
  3. '='를 붙이지 않고 { }안에 키를 입력한 후 값을 할당한다.

그런데 여기서 직접 숫자를 할당해주지 않아도 자동으로 순서대로 숫자가 0부터 하나씩 할당된다.

또, 특정 숫자부터 하나씩 증가하도록 할당할 경우 첫 번째 값에 할당하면 자동으로 하나씩 숫자가 증가한다.

enum Role {
    ADMIN = 10,
    USER ,
    GUEST,
}

console.log(user1, user2, user3);
// { name: '김기지', role: 10 } { name: '강백호', role: 11 } { name: '소형준', role: 12 }

// 중간에 할당할 경우도 가능
enum Role {
    ADMIN ,
    USER = 10,
    GUEST,
}

console.log(user1, user2, user3);
// { name: '김기지', role: 0 } { name: '강백호', role: 10 } { name: '소형준', role: 11 }

이렇게 값에 숫자가 할당되는 enum을 숫자형 enum이라고 부른다.

 

 

enum 타입에는 문자열 값도 할당할 수 있다.
enum Language {
   korean = 'ko',
   english = 'en' 
}

user에 language를 할당해보자.

const user1 = {
    name : '김기지',
    role : Role.ADMIN, // 0 <- 관리자
    language : Language.korean,
}

console.log(user1);
// { name: '김기지', role: 0, language: 'ko' }

enum은 컴파일 결과 객체가 된다.

enum은 컴파일 될 때 다른 타입들처럼 사라지지 않고 자바스크립트 객체로 변환된다.

따라서 변환 후에도 값으로 사용할 수 있다. 

 


🔗 타입스크립트 강의

 

한 입 크기로 잘라먹는 타입스크립트 - 인프런 | 강의

문법을 넘어 동작 원리와 개념 이해까지 배워도 배워도 헷갈리는 타입스크립트 이제 제대로 배워보세요! 여러분을 타입스크립트 마법사🧙🏻‍♀️로 만들어드립니다., 프론트엔드의 피할 수

www.inflearn.com

 

728x90