천진난만 코딩 스토리

2. JavaScript 응용 - 조건문 다듬기 본문

인프런/한입 크기로 잘라 먹는 리액트

2. JavaScript 응용 - 조건문 다듬기

Wisdom_1104 2023. 2. 6. 00:24

1 ) 특정 값이 여러 값 중 하나인지 확인

function person(name) {
  return (
    name === '오리' || name === '올라프' || name === '상어' || name === '공룡'
  );
}

console.log(person('오리')); // true
console.log(person('커피')); // false

특정 값이 여러 값 중 하나인지 확인을 해야 하는 상황일 때

비교해야 할 값이 많아질수록 코드는 길어짐.

이 코드를 짧게 하려면,

배열을 만들고 배열의 includes 함수를 사용하면 됨.

 

const person = name => ['오리', '올라프', '상어', '공룡'].includes(name);

console.log(person('상어')); // true
console.log(person('아몬드')); // false

includes는 배열 안에 특정 값이 존재하는지 확인하는 함수.

 

 

 

2 ) 값에 따라 다른 결과물을 반환

function getColor(person) {
  if (person === '오리') return '노란색';
  if (person === '올라프') return '하얀색';
  if (person === '상어') return '파란색';
  if (person === '공룡') return '초록색';
  return '투명';
}

console.log(getColor('올라프')); // 하얀색
console.log(getColor()); // 투명

주어진 값에 따라 다른 결과물을 반환해야 할 때

if문을 여러 번 반복하는 것 대신에 객체를 활용하면 더 깔끔하게 작성 가능.

 

function getColor(person) {
  const color = {
    오리: '노란색',
    올라프: '하얀색',
    상어: '파란색',
    공룡: '초록색'
  };
  return color[person] || '투명';
}

console.log(getColor('공룡')); // 초록색
console.log(getColor('')); // 투명

객체를 활용하니 반복되는 코드도 줄고 깔끔해져서 가독성이 좋아짐.