자바스크립트 if else와 빠른 return

계산기를 만들던 중..

if else 를 중첩시키지 않고 빠르게 return 하는 법을 배웠다.

const onClickNumber = (event) => {
    if (operator) {
        if (!numTwo) {
            $result.value = '';
        }
        numTwo += event.target.textContent;
    }
    else {
        numOne += event.target.textContent;
    }
    $result.value += event.target.textContent;
};

위와 같은 코드는 if 문이 중첩되어있어 가독성이 좋지않다.

const onClickNumber = (event) => {
    if (!operator) {
        numOne += event.target.textContent;
        $result.value += event.target.textContent;
        return;
    }
    if (!numTwo) {
        $result.value = '';
    }
    numTwo += event.target.textContent;
    $result.value += event.target.textContent;
}; 

빠르게 return을 시키는 방법을 통해 코드를 개선할 수 있다.

1. if 문 다음에 나오는 공통된 절차를 각 분기점 내부에 넣는다.
2. 분기점에서 짧은 절차부터 실행하도록 if 문을 작성한다.
3. 짧은 절차가 끝나면 return 이나 break 로 중단한다.
4. else 를 제거한다.

참고영상(제로초님 계산기): https://youtu.be/NUOPdY14JKo?list=PLcqDmjxt30RvEEN6eUCcSrrH-hKjCT4wt