/ FRONTEND

클린코드 자바스크립트 4-3 분기 다루기(else if & else 피하기, Early Return)

Clean Code JS 강좌는 여러 절로 구성되어 있습니다.

분기 다루기 😎

else if & else 피하기👍

  • Promise then chaining 과 같은 오해
  • 많이 늘어질 경우에는 switch 문을 사용하는 것이 좋다.
const x = 1;
if (x >= 0) {
  console.log("x는 0과 같거나 크다");
} else if (x > 0) {
  console.log("x는 0보다 크다");
}

// 위와 똑같은 예
if (x >= 0) {
  console.log("x는 0과 같거나 크다");
} else {
  if (x > 0) {
    console.log("x는 0보다 크다");
  }
}

const getActiveUserName = (user) {
  if(user.name) {
    return user.name;
  }
}

// 함수가 2가지 역할을 할 때 에러가 난다.
// => 참,거짓으로 반대되는 결과를 가져오는 else
function getHelloCustomer(user) {
  if(user.age < 20) {
    report(user);
  }
  // else { => else 사용시 return '인냥하세요' 실행이 되지 않는다.
  return '안녕하세요';
  // }
}

Early Return👍

// 읽기 어려움
function loginService(isLogin, user) {
  if (!isLogin) {
    if (checkToken()) {
      if (!user.nickName) {
        return registerUser(user);
      } else {
        refreshToken();

        return "로그인 성공";
      }
    } else {
      throw new Error("No Token");
    }
  }
}

function loginService2(isLogin, user) {
  // Early Return
  /**
   * 함수를 미리 종료
   * 사고하기 편하다.
   */
  if (isLogin) {
    return;
  }
  if (!checkToken) {
    throw new Error("No Token");
  }
  if (!user.nickName) {
    return registerUser(user);
  }

  refreshToken();

  return "로그인 성공";
}

function 오늘하루(condition, weather, isJob) {
  if (condition === "GOOD") {
    공부();
    게임();
    유투브보기();
  }

  if (weather === "GOOD") {
    운동();
    빨래();
  }

  if (isJob) === "GOOD") {
    야간업무();
    조기취침();
    유투브보기();
  }
}


function 오늘하루(condition, weather, isJob) {
  if (condition !== "GOOD") {
    return
  }
  공부();
  게임();
  유투브보기();
  if (weather !== "GOOD") {
    return
  }
  운동();
  빨래();
  if (isJob !== "GOOD") {
    return
  }
  야간업무();
  조기취침();
  유투브보기();

}

부정 조건문 지양하기👍

  • 생각을 여러번 해야할 수 있다.
  • 프로그래밍 언어 자체로 if문이 처음부터 오고 true부터 실행시킨다.

부정 조건 사용하는 예외

  1. Early Return
  2. Form Validation
  3. 보안 혹은 검사하는 로직

const isCondition = true;
const isNotCondition = false;

// NaN
// Not a Number

if(!isCondition) {
  console.log("거짓인 경우에만 실행")
}

if(isNotCondition) {
  console.log("거짓인 경우에만 실행")
}


function isNumber(num) {
  return !Number.isNaN(num) && typeof num ==='number';
}

is(isNumber(3)) {
  console.log('숫자입니다.')
}