본문 바로가기
클린코드 샘플(JavaScript)

if else - 맵핑관계 분석 후 정의(데이터를 객체화, 로직을 분리)

by 찬찬2 2022. 11. 1.

★ 규칙을 찾아내고 기능별 최소 단위로 쪼개어 분리하여 관리하는 습관이 필요하다.

 

맵핑관계 정의

 

Dirty Sample#1

function excutePayment(){
	if(payment === "KAKAO_PAYMENT"){
		return "카카오 결제 처리";
	}else if(payment === "NAVER_PAYMENT"){
		return "네이버 결제 처리";
	}else if(payment === "COUPANG_PAYMENT"){
		return "쿠팡 결제 처리";
	}else if(payment === "PAYCO_PAYMENT"){
		return "페이코 결제 처리";
	}else if(payment === "APPLE_PAYMENT"){
		return "애플 결제 처리";
	}
}

 

↑↑ 위 코드는 if문으로 분기처리가 많이 되어있어 가독성이 많이 떨어진다. 유지보수에 불편함이 있다.

 

Clean Sample#1 - 맵핑 대상을 객체로 만들고, 비즈니스 로직을 분리한다.

const paymentMap = { // 고정된 값, 데이터
    "KAKAO_PAYMENT" : "카카오 결제 처리",
    "NAVER_PAYMENT" : "쿠팡 결제 처리",
    "PAYCO_PAYMENT" : "페이코 결제 처리",
    "APPLE_PAYMENT" : "애플 결제 처리"
}

function excutePayment(paymentType){ // 비즈니스 로직
    return paymentMap[paymentType];
}

excutePayment("KAKAO_PAYMENT");

 

↑↑ 규칙을 가지는 데이터를 객체화하여 분리한다. 로직과 데이터가 분리되면서 유지보수에 용이한 것을 볼 수 있다. 

 

Dirty Sample#2

function funcA(){}
function funcB(){}
function funcC(){}
function funcD(){}

function excutePayment(paymentType){
    if(paymentType === "KAKAO_PAYMENT"){
        funcA();
    }else if(paymentType === "NAVER_PAYMENT"){
        funcB();
        funcC();
    }else if(paymentType === "GOUPANG_PAYMENT"){
        funcA();
        funcD();
    }else if(paymentType === "PAYCO_PAYMENT"){
        funcA();
        funcB();
    }
}

excutePayment("KAKAO_PAYMENT");

 

 

Clean Sample#2

const paymentMap = { 
    KAKAO_PAYMENT(){ // ver.1 함수(function, 화살표)를 생략할 수있다.
    	funcA();
        funcA();
    },	
    NAVER_PAYMENT: () => funcB(), // ver.2
    GOUPANG_PAYMENT: () => funcC() // ver.2
    PAYCO_PAYMENT: funcD // ver.3
}

function funcA(){ console.log("funcA called~!") }
function funcB(){ console.log("funcB called~!") }
function funcC(){ console.log("funcC called~!") }
function funcD(){ console.log("funcD called~!") }

function excutePayment(paymentType){ // 비즈니스 로직
    paymentMap[paymentType]();
}

excutePayment("GOUPANG_PAYMENT");

 

↑↑ 이번에는 함수에 대한 객체화이다.  위와 같이 함수들을 모아 객체화하고, ver.1과 같이 다수의 함수를 넣을 수 있는 공간도 만들 수 있는 것을 볼 수 있다.

댓글