If문은 한번 중첩해서 사용하고 나면 계속 해서 중첩해 사용할 확률이 높기때문에 코드의 가독성을 위해 if문의 중첩을 줄여주는게 좋다.
If문의 중첩을 3단계에 걸쳐서 줄여보자.
예시 코드를 살펴보자.
const test = () => {
let result = '';
if(a) {
if (!b) {
result = 'c';
}
} else {
result = 'a';
}
//공통된 동작문
result += 'b';
return result;
}
저 공통된 동작문이 있는 것을 확인 했으면
const test = () => {
let result = '';
if(a) {
if (!b) {
result = 'c';
}
//공통된 동작문
result += 'b';
return result;
} else {
result = 'a';
//공통된 동작문
result += 'b';
return result;
}
}
이렇게 분기점마다 넣어준다.
2단계를 적용해보자
const test = () => {
let result = '';
if(a) {
//긴 절차
if (!b) {
result = 'c';
}
result += 'b';
return result;
} else {
//짧은 절차
result = 'a';
result += 'b';
return result;
}
}
위의 코드를 보면 짧은 절차가 밑에 위치해 있기 때문에 짧은 절차를 먼저 실행 해주기위해 2단계에서 언급한대로 위로 올려 재배치해준다.
const test = () => {
let result = '';
if(!a) { // 재배치에 의해 조건이 바뀌었으므로 "!"를 추가해준다.
//짧은 절차
result = 'a';
result += 'b';
return result;
} else {
//긴 절차
if (!b) {
result = 'c';
}
result += 'b';
return result;
}
}
const test = () => {
let result = '';
if(!a) {
result = 'a';
result += 'b';
return result;//이미 넣어져있는 경우는 생략해도된다.
} //else를 지워줌
if (!b) {
result = 'c';
}
result += 'b';
return result;
}
이렇게 else를 지우고 나면 하나의 중복된 if가 사라지는걸 볼수있다.