[jstips] 중첩된 조건문 개선 if, switch
중첩된 조건문 개선
[jstips]에서(http://www.jstips.co/)에서 javascript를 사용할 때 중첩된 if문을 조금 더 깔끔하고 효율적으로 만들 수 있을지에 대해서 읽었습니다.
if (color) {
if (color === 'black') {
printBlackBackground();
} else if (color === 'red') {
printRedBackground();
} else if (color === 'blue') {
printBlueBackground();
} else if (color === 'green') {
printGreenBackground();
} else {
printYellowBackground();
}
}
우선 중첩된 if문을 개선하는 방법 중에 하나는 switch문을 사용하는 것입니다.
switch문을 사용하면 더 짧고 깔끔하게 만들 수 잇지만 break;를 생략하는 것과 같은 오류를 디버깅하기에 어렵기 때문에 사용하지 않는 것이 좋습니다.
switch(color) {
case 'black':
printBlackBackground();
break;
case 'red':
printRedBackground();
break;
case 'blue':
printBlueBackground();
break;
case 'green':
printGreenBackground();
break;
default:
printYellowBackground();
}
조건문에 여러 가지 조건이 들어가는 경우에도 조건문을 짧고 깔끔하게 쓰고 싶다면 switch를 사용할 수 있습니다.
이 경우에는 switch문의 파라미터로 true를 넣고, case에 아래처럼 조건을 넣으면 가능합니다.
switch(true) {
case (typeof color === 'string' && color === 'black'):
printBlackBackground();
break;
case (typeof color === 'string' && color === 'red'):
printRedBackground();
break;
case (typeof color === 'string' && color === 'blue'):
printBlueBackground();
break;
case (typeof color === 'string' && color === 'green'):
printGreenBackground();
break;
case (typeof color === 'string' && color === 'yellow'):
printYellowBackground();
break;
}
리팩토링 같은 걸 생각할 필요가 없다면, 각 색의 함수를 만드는 것 대신에 색을 인수로 갖는 함수를 만들어서 해결할 수도 있습니다.
function printBackground(color) {
if (!color || typeof color !== 'string') {
return; // Invalid color, return immediately
}
}
그러나 만약 리팩토링도 생각해야 한다면, 여러번 조건을 확인하고 swtich문을 사용하는 것을 피해야 합니다.
결론
중첩된 if문을 개선하는 가장 효율 적인 방법은 object를 사용하는 방법입니다.
var colorObj = {
'black': printBlackBackground,
'red': printRedBackground,
'blue': printBlueBackground,
'green': printGreenBackground,
'yellow': printYellowBackground
};
if (color in colorObj) {
colorObj[color]();
}