Else 쓰지 마세요

민경찬·2023년 7월 27일
66

백엔드

목록 보기
7/20
post-thumbnail

서론


If문 뒤에 Else문을 붙이지 않도록 개발하자. 이유를 한 번 알아보자.


본론


아래 코드를 봤을 때 우리는 어떤 코드인지 단 번에 예측 가능하다.

if (x !== 0) {
	return 10 / x;
}

그러나 아래의 코드만을 봤을 때 다음 코드가 무슨 말을 하는지는 모를 것이다.

else {
	return 0;
}

왜 0을 리턴하는지? 일반적인 반환 형태인지? 문제가 있다는 것을 반환하는 것인지?

단 번에 이해하기 힘들다.

그럼 어떻게 작성하나요?

다양한 상황에서 어떤 변수의 값을 검증해야할 때가 많다. 다음 예시를 보자.

const doSomething = (err, something) => {
	if (err) {
    	console.log(err);	
    } else {
    	if(something.OK) {
        	//Do Something
        } else {
        	console.log('Invalid');
        }
    }
}

if, else가 뒤엉켜있다. 다음과 같이 바꿔보자

const doSomething = (err, something) => {
	if (err) {
    	return console.log(err);	
    } 
  
	if (!something.OK) {
		return console.log('Invalid');
	}
  
	//Do Something
}

검증이 필요한 경우 중요한 로직이 작동하기 전에 검사하고 리턴을 시켜주는 것으로 코드를 명확하게 작성할 수 있다.

비동기의 처리의 경우는요?

비동기 처리의 경우 다음 예시처럼 작성할 수 있다.

const doSomething = async (err) => {
	if (err) {
    	throw err;	
    }

 	//Do something
}

throw를 적절하게 활용하여 검증을 빠르게 처리하고 함수를 중단시킬 수 있다.

express에서는 어떻게하나요?

내가 본 많은 사람들이 다음과 같은 문제를 간과한다.

app.get('/', (req, res, next) => {
	res.send({});
  
  	console.log('hi'); // hi
});

res.send메서드는 return이나 throw처럼 코드를 중지 시키지 않는다.

즉, console.log함수는 그대로 실행된다.

아래 코드는 express에서 사용을 권장하는 에러 처리 handler이다.

app.use((err, req, res, next) => {
	// Error handler	
  	// 에러 처리 로직...
});

handlernext메서드의 파라미터가 비어있지 않을 경우에 작동한다. 즉 아래의 코드 처럼 handler안에서 next메서드의 에러를 집어넣어 사용하며 err파라미터를 통해 에러를 전달받아 처리할 수 있다.

app.get('/', (req, res, next) => {
	next(new Error('Error'));
});

하지만 위에서 언급했던 방식대로 next함수는 returnthrow처럼 함수를 즉시 중단시켜주지 않기 때문에 다음과 같은 방식으로 사용해야 한다.

app.get('/', (req, res, next) => {
	return next(new Error('Error'));
});

express 사용 예시

API 사용자로부터 데이터를 검증하거나 에러가 발생하면 즉시 에러 처리 handler로 던져주면 된다. 다음 예시를 보자.

app.post('/auth', (req, res, next) => {
	// from FE
	const inputId = req.body.id;
  
  	if (!inputId) {
		return next({ status: 400, message: 'Bad Request' });
    }
  
  	// Do Something
});

코드가 깔끔해진다.


결론


누군가는 당연한 것 아니냐고 물어본다. 하지만 필자는 이 내용을 개발 공부 시작한지 1년 6개월이 지나서야 깨달았다. 작동에 문제가 되지 않았으니 말이다.

return next만 알았어도 여태 작성한 복잡한 로직들을 전부 단순하게 처리할 수 있었는데... 아쉬움이 많이 남아있다.

Else쓰지 말라고 알려주신 창준님께 다시 한 번 감사인사 드립니다. 감사합니다.




참고

7개의 댓글

comment-user-thumbnail
2023년 7월 27일

잘 봤습니다. 좋은 글 감사합니다.

답글 달기
comment-user-thumbnail
2023년 7월 27일

오홍홍 조와요

답글 달기
comment-user-thumbnail
2023년 7월 28일

맞말입니다

답글 달기
comment-user-thumbnail
2023년 7월 29일

if문을 줄이고 분기 요소를 줄여나가는게, 좋은 코드의 핵심인것 같더라고요. 개발자로써 추상화 능력이 중요하단 생각이 듭니다. 잘 읽었습니다!

답글 달기
comment-user-thumbnail
2023년 8월 2일

return next 보단

next
return이 더좋지 않을까용?

답글 달기
comment-user-thumbnail
2023년 8월 2일

잘 읽었습니다. 좋은 글 감사합니다.

답글 달기
comment-user-thumbnail
2023년 8월 2일

좋은 지식 공유 감사합니다.

답글 달기