Study/JavaScript(Clean code)

[JavaScript][clean-code] else if & else피하기

갈푸라떼 2022. 5. 29. 18:50

* else if 피하기

  • else if 를 promise의 then chaning처럼 생각하는 경우가 있다.
  • 따라서 else if가 늘어질 경우 switch문으로 대처하는게 맞다.
  • else if를 이용하는것보다 명확하게 조건을 구분하는것이 더 좋다.

* else if는 파이프라인처럼 흐르는게 아닌 else처리를 하고 한번 더 if문이 동작하는 것이다.

  • 두 코드는 완전히 동일하게 동작하는 코드이다.
count x = 1;
if (x >=0) {
  'x는 0과 같거나 크다';
} else if (x > 0) {
  'x는 0보다 크다';
}
if (x >=0) {
  console.log('x는 0과 같거나 크다');
} else {
  if (x > 0) {
    console.log('x는 0보다 크다.');
  }
}

* else if를 이용하는것보다 명확하게 조건을 구분하는것이 더 좋다.

if (x >= 0) {
  console.log('x는 0과 같거나 크다');
}

if (x > 0) {
  console.log('x는 0보다 크다');
}

* else 피하기

// else를 사용하지 않고 코드 사용하기
function getActiveUserName(user) {
  if (user.name) {
    return user.name;
  } else {
    return '이름없음';
  }
}

function getActiveUserName(user) {
  if (user.name) {
    return user.name;
  }

  return '이름없음';
}
  • else를 사용하지 않고 위와 같이 작성할 수 있다.
  • if else는 참 일때와 거짓일때가 명백하게 짜여져있는 로직이다.
  • else를 사용하면 논리적으로 로직이 반전된 기능을 사용하게 된다.
    • 문제점이 발생한다.(아래의 예시)

* 따라서 이럴때 발생할 수 있는 문제점이 있다.

- 만약 하나의 함수가 두가지 역할을 할 때 문제가 생긴다.
(하나의 함수가 2개의 역할을 할 때 else를 사용하게 되면 문제가 생긴다.)

// age가 20 미만시 특수 함수 실행
// BAD CODE
function getHelloCustomer(user) {
  if (user.age < 20) {
    report(user);
  } else {
    return '안녕하세요';
  }
}

// GOOD CODE
function getHelloCustomer(user) {
  if (user.age < 20) {
    report(user);
  }
  return '안녕하세요';
}

- BAD CODE

  • 함수를 분리하지 않고 맹목적으로 else를 사용하여 잘못된 사례이다.
  • 매개변수로 다른조건이 와도 '안녕하세요' 로직은 계속 실행이 되어야한다.
  • 하지만 report함수의 조건에 걸리게 되어 else까지 오지 않는다.
  • 함수가 하나의 역할만 하여야 하는데 2개의 역할로 통합시켜버려서 분리를 못하였기 때문이다.
  • 애초에 else문을 안쓰면 된다.
  • 항상 else문을 사용하지 않아도 된다.

- GOOD CODE

  • 조건이 맞을때만 report함수를 호출하고 '안녕하세요'를 반환하는 목적은 계속 수행한다.