[JavaScript] 조건부 처리

IF문

기본구조

if (cond) {
  // 조건이 true 실행
} else {
  // 조건이 false 실행
}

복잡한 조건식

// 조건식이 복잡한 경우
if (age >= 10 && age <= 19) {
  // 한눈에 보기 어렵습니다.
}

// 조건에 대한 함수를 따로 만들어 명칭으로 알기 쉽게 합니다.
function isTeen(age) {
  return age >= 10 && age <= 19;
}

if (isTeen(age)) {
  // 함수에 명칭으로 십대일 경우 true임을 파악합니다.
}

조기 반환(early return) 패턴

유효하지 않은 경우를 먼저 처리하여 처리 로직에 집중할 수 있게합니다.

// 중첩 조건문
function processMan(user) {
  if (user.age > 0) {
    if (user.sex === 'Man') {
      // 처리 로직
    } else {
      throw new Error('남성만');
    }
  }
}

// 조기 반화 패턴
function processMan(user) {
  if (user.age <= 0) return;
  if (user.sex !== 'Man') {
    throw new Error('남성만');
  }
  
  // 처리 로직
}

삼항 연산자

기본 구조

// isOnline이 true일 경우 online을 false일 경우 offline이 상태값 저장됩니다.
const status = isOnline ? 'online' : 'offline'

중첩 구조

// score에 따른 학점을 결정하는 함수
const getGrade = (score) =>
  score >= 90 ? 'A' :
  score >= 80 ? 'B' :
  'C';

템플릿 리터럴 사용

const helloMessage = (name) => `hello ${name ? name : '게스트'}`;

널 병합 연산자 사용

const getUserStatus = (status) =>
  status ?? 'guest'; // 상태가 null 또는 undefined인 경우 'guest' 반환

const getUserMessage = (status) => {
  const userStatus = getUserStatus(status);
  return userStatus === 'admin' ? '관리자님 환영합니다.' :
         userStatus === 'member' ? '회원님 환영합니다.' :
         '방문자님 환영합니다.';
};