Javascript에서 If-else 지옥 탈출

배경 이야기 / 문제

몇 달 전, 사용자가 입력한 각 양식의 백분율을 계산해야 하는 경우가 있습니다. 양식, 사용자 속성 정보 등), 시스템 흐름은 간단히 말해서 다음과 같습니다.



첫 번째 접근 방식은 if/else 문을 사용하여 조건 논리를 처리하는 것이었습니다. 여기저기서 하나 또는 두 개의 조건에 대해 좋은 생각일 수 있지만 함께 연결된 여러 if-else 문을 사용하면 코드가 매우 보기 흉하고 가독성이 떨어집니다. 제 경우 if-else 문이 30개 이상 있을 수 있습니다. 5가지 형태로 흩어져 있습니다. 거짓말이 아니라 매우 단순하고 요점이 명확해 보이지만 읽기에는 고통스럽습니다.

또한 동료가 PR을 검토할 때 reddit에서 유머러스한 내용을 언급합니다the code behind yandere simulator.


보시다시피 지옥의 if-else 문입니다.

해결책

솔루션은 상황/필요에 따라 달라집니다. 그러나 가장 필요한 것은 개체입니다. 예를 들어 키를 기반으로 문자열을 반환해야 한다고 가정해 보겠습니다.

function checkStatus(status) {
    if (status.toLowerCase() === 'available') {
        return `The user is currently available`
    } else if (status.toLowerCase() === 'busy') {
        return `The user is currently busy`
    } else if (status.toLowerCase() === 'away') {
        return `The user is away from keyboard`
    } else if (status.toLowerCase() === 'breaktime') {
        return `The user is having a good lunch`
    }
}

다른 20개 이상의 상태 유형이 있다고 상상해 보세요. 그렇게 많은 if-else 문을 읽거나 쓰는 것이 편합니까?

대신 객체 또는 Map 객체를 사용하여 조회할 쌍으로 된 키와 값으로 구성된 일종의 테이블을 만들 수 있습니다.

function checkStatus(status){
const statusList = {
   available: 'The user is currently available',
   busy: 'The user is currently busy',
   away: 'The user is currently away from keyboard',
   breaktime: 'The user is currently having a good lunc'
}

return statusList[status]; //console.log(statusList[status])
}

반복되는 if-else 문을 반복해서 작성하는 시간을 절약하기 위해 알고리즘 leetcode-type-of-question에도 적용할 수 있습니다.

읽어 주셔서 감사합니다!!!
좋은 하루 되세요. 항상 생각하는 프로젝트는 코딩 자체가 아님을 기억하세요 🤪.