aotoyae

[TS] enum 열거형 타입 본문

TypeScript

[TS] enum 열거형 타입

aotoyae 2024. 3. 4. 19:04

 

 

💡enum 타입에 대해 알아보자.

상품 사이즈처럼 값의 종류를 나열할 수 있는 경우에 쓸 수 있는 타입

 

let product: {
  id: string;
  name: string;
  price: number;
  membersOnly?: boolean;
  sizes: string[];
} = {
  id: 'c001',
  name: '주전자',
  price: 129000,
  sizes: ['M', 'L'],
};

 

위와 같이 객체 타입을 정해줬을 때 사이즈는 항상 S, M, L .. 정도만 있을 텐데

string 문자열 타입으로 정해준 건 너무 광범위한 느낌이 든다.

 

객체의 범위를 정해주는 enum 타입으로 바꿔보자!

enum Size { // 요런 식으로 값을 나열해 주고
  S,
  M,
  L,
  XL,
}

let product: {
  id: string;
  name: string;
  price: number;
  membersOnly?: boolean;
  sizes: Size[]; // 타입을 정해줄 땐 enum 이름만 적어주고
} = {
  id: 'c001',
  name: '주전자',
  price: 129000,
  sizes: [Size.M, Size.L], // 값을 쓸 땐 객체처럼 점 표기법을 쓴다.
};

 

그럼 enum 은 무슨 값을 가지고 있을까?

console.log(Size.S); // 0 정수형 값을 갖고 있다!
console.log(Size.M); // 1
console.log(Size.L); // 2
console.log(Size.XL); // 3

 

그래서 아래의 경우 값이 없을 때와 S 사이즈가 똑같이 처리되버린다.

function findProduct(size?: Size) {
  if (!size) {
    console.log('전체 사이즈로 검색');
    return;
  }

  console.log('특정 사이즈로 검색');
}

findProduct(Size.M); // 특정 사이즈로 검색
findProduct(Size.S); // 전체 사이즈로 검색
findProduct(); // 전체 사이즈로 검색

 

❗️ 그러니 enum 을 사용할 땐 되도록 값을 정해놓고 쓰자!

enum Size {
  S = 'S',
  M = 'M',
  L = 'L',
  XL = 'XL',
}

//...

findProduct(Size.M); // 특정 사이즈로 검색
findProduct(Size.S); // 특정 사이즈로 검색 => 원하는 값이 잘 나온다.
findProduct(); // 전체 사이즈로 검색