[Javascript] 조건문 활용하기

 
 
 
이번 글에서는 여러 상황에서 자바스크립트 조건문을 보다 더 잘 활용하는 방법에 대해 알아보려 한다.
 
 
 

특정 값이 여러 값 중 하나인지 확인할 때

 
만약 어떤 값이 여러 값들 중 하나인지 확인해야 하는 상황이 생겼다고 가정해 보자. 그렇다면 우선 아래와 같은 시도를 해 볼 수 있을 것이다.
 

function isAnimal(text) {
  return (
  
    text === '고양이' || text === '강아지' || text === '거북이' || text === '너구리'
  );
}

console.log(isAnimal('강아지')); // true
console.log(isAnimal('휴대폰')); // false

 
이러한 코드는 비교해야 할 값이 많아질수록 길어진다. 이를 간단하게 해결할 수 있는 방법은 배열을 만들고 includes 함수를 사용하는 것이다.
 

function isAnimal(name) {
  const animals = ['고양이', '강아지', '거북이', '너구리'];
  return animals.includes(name);
}

console.log(isAnimal('강아지')); // true
console.log(isAnimal('휴대폰')); // false

 
딱 보기에도 훨씬 깔끔해졌다. 원한다면 animals라는 배열을 선언하는 것도 생략하고 화살표 함수를 활용해 코드를 작성할 수도 있다.
 

const isAnimal = name => ['고양이', '강아지', '거북이', '너구리'].includes(name);

console.log(isAnimal('거북이')); // true
console.log(isAnimal('휴대폰')); // false

 
물론 코드가 짧다고 해서 무조건 좋은 코드인 것은 아니다. 하지만 짧으면서도 어떠한 역할을 하는지 잘 이해될 수 있는 코드가 비로소 좋은 코드라고 할 수 있을 것이다.
 
 

---

 
 
 

값에 따라 다른 결과물을 반환할 때

 
이번에는 주어진 값에 따라 다른 결과물을 반환해야 할 때 사용할 수 있는 방법에 대해 알아보려 한다. 예를 들어 동물의 이름을 받아 그 동물의 울음소리를 반환하는 함수를 만드는 상황을 가정해 보겠다.

function getAnimalSound(animal) {
  if (animal === '강아지') return '멍멍';
  if (animal === '고양이') return '야옹';
  if (animal === '참새') return '짹짹';
  return '...?';
}

console.log(getAnimalSound('강아지')); // 멍멍
console.log(getAnimalSound('고양이')); // 야옹

 
만약 여기서 switch-case문을 사용하면 아래와 같이 구현할 수 있다(참고로 switch문에서 return을 할 때에는 break를 생략해도 된다).

function getAnimalSound(animal) {
  switch (animal) {
    case '강아지' : 
    	return '멍멍';
    case '고양이' :
    	return '야옹';
    case '참새' : 
    	return '짹짹';
    default:
    	return '...?';
  }
}

console.log(getAnimalSound('강아지')); // 멍멍
console.log(getAnimalSound('고양이')); // 야옹

 
 
방금 구현한 코드도 별다른 문제는 없지만 이걸 보다 더 깔끔하게 해결할 수 있는 방법을 알고 나면 조금 마음에 들지 않는 형태이다.

function getAnimalSound(animal) {
  const sounds = {
    강아지: '멍멍',
    고양이: '야옹',
    참새: '짹짹',
  };
  return sounds[animal] || '...?';
}

console.log(getAnimalSound('강아지')); // 멍멍
console.log(getAnimalSound('고양이')); // 야옹

 
훨씬 더 간단하고 가독성도 좋지 않은가? 이렇게 특정 값에 따라 반환해야 하는 값이 다른 조건이 여러 가지 있을 때에는 객체를 활용하는 것이 좋다.
 
반면 값에 따라 실행해야 하는 코드 구문이 다를 때에는 어떻게 해야 할까?
객체에 함수를 넣으면 된다.

function getAnimalSound(animal) {
  const tasks = {
    강아지: function () {
      console.log('멍멍');
    },
    고양이: function () {
      console.log('야옹');
    },
    참새: function () {
      console.log('짹짹');
    }
  };

  if (!tasks[animal]) {
    console.log('...?');
    return;
  }

  tasks[animal]();
}

getAnimalSound('강아지'); // 멍멍
getAnimalSound('고양이'); // 야옹
getAnimalSound('호랑이'); // ...?