// 1. 페이지의 에서 최대한 위에 이 코드를 붙여넣으세요. // 아래의 메타 태그를 복사해 사이트 홈페이지의 섹션에 붙여 넣어주세요. //2. 여는 태그 바로 뒤에 코드를 붙여넣으세요.

새소식

반응형
Javascript/Clean Code Series(클린코드)

(JS)Clean Code Series4 - Enums vs Dictionaries#열거형과 사전

  • -
반응형

enum은 상수 값으로 이루어져 있는 집합이라고 볼 수 있습니다. Typescript에서는 enum을 지원하지만 javascript에서는
지원하지 않습니다.

    enum MagicianSkills {
      fireball = '불로 이뤄진 구체를 날림',
      iceball = '얼음으로 이뤄진 구체를 날림',
      thunderball = '번개로 이뤄진 구체를 날림',
    }

    const useSkill: MagicianSkills = MagicianSkills.fireball
    console.log('useSkill : ', useSkill);
    // 결과  useSkill :  불로 이뤄진 구체를 날림

 

위의 코드를 자바스크립트로 표현을 하려면 객체를 이용하여 구현해야 합니다.
python처럼 다른 언어들중에는 enum을 지원하지만 javascript에서는 직접 구현해야합니다.

 

   const Skills = {
      fireball: 'fireball',
      iceball: 'iceball',
      thunderball: 'thunderball',
    }

    const fireMagician = {
      skill: Skills.fireball
    }

    const iceMagician = {
      skill: Skills.iceball
    }

    const thunderMagician = {
      skill: Skills.thunderball
    }

 

enum switch문을 함수를 사용하여 원하는 값을 리턴받아 사용하곤 합니다
하지만 switch문은 case를 쓰고 한칸 내려서 꼭 return을 해줘야 하며 코드가 조금은 복잡해집니다.

 

    const useMagicianSkill = (magician) => {
      switch (magician.skill) {
        case Skills.fireball:
          return '불로 이뤄진 구체를 날림'
        case Skills.iceball:
          return '얼음으로 이뤄진 구체를 날림'
        case Skills.thunderball:
          return '번개로 이뤄진 구체를 날림'
      }
    }

    console.log('useMagicianSkill : ', useMagicianSkill(fireMagician));
    // useMagicianSkill :  불로 이뤄진 구체를 날림

 

그러나 dictionary를 사용하면 좀 더 간결하게 작성할 수 있습니다. 간결한만큼 코드 가독성도 좋아집니다.
enum dictionary는 비슷해보이지만 enum은 상수값들의 집합이지만 dictionary는 키와 값의 집합입니다.

 

    const useMagicianSkillDictionary = (magician) => {
      let magicianSkills = {
        [Skills.fireball]: '불로 이뤄진 구체를 날림',
        [Skills.iceball]: '얼음으로 이뤄진 구체를 날림',
        [Skills.thunderball]: '번개로 이뤄진 구체를 날림',
      }
      return magicianSkills[magician.skill]
    }

    console.log('useMagicianSkillDictionary : ', useMagicianSkillDictionary(thunderMagician));
    // useMagicianSkillDictionary :  번개로 이뤄진 구체를 날림

enum dictionary를 비교해서 보시기에 어떠신가요? 현재는 skill이 세가지만 예시로 넣어놨지만 10가지 이상 된다면
switch를 사용한 enum 1가지당 case, return 2줄을 꼭 써줘야 하지만 dictionary 10가지 해도 10줄만 쓰면 됩니다.
코드량이 2배차이가 되는것입니다.

 

코드량이 줄어들고 간결해지면 그만큼 생산성도 증가한다는 셈이 되는 것입니다.

 

 

 

 

반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.