아무리 프로그래밍에 능숙한 사람이라도 에러가 있는 스크립트를 작성할 수 있다.

원인은 아마도 실수나 예상치 못한 사용자 입력, 잘못된 서버 응답 등의 수천만 가지 이유 때문일 것입니다.

에러가 발생하면 스크립트는 죽고(즉시 중단), 콘솔에 에러가 출력됩니다.

그러나 try..catch 문법을 사용하면 스크립트가 죽는 걸 방지하고, 에러를 잡아서 더 할당한 무언가를 할 수 있게 됩니다.

<aside> 💡 *throw → “님아 에러 났음” catch → “아 그렇다면~”

에러 처리는 예상할 수 없는 예외상황을 위해 에러 처리를 해 주는 것이 좋다. 에러 처리를 잘 해주기 위해서는 에러를 필요한 경우에서 잘 던져주고(throw new Error(), Promise.reject()), 예외상황에서 에러를 잡아서(try~catch) 처리해 주는 상호적인 에러 처리가 되어야 한다.*

</aside>

try catch

try catch 사용하기

직접 에러를 만들어서 던지기

에러 다시 던지기

try catch finally

finally? 아니면 코드만?

전역 catch

<aside> 💡

*Axios에서 try catch 에러 핸들링

the default behavior is to reject every response that returns with a status code that falls out of the range of 2xx and treat it as an error. 기본 동작은 2xx 범위를 벗어나는 상태 코드와 함께 반환되는 모든 응답을 거부하고 오류로 처리하는 것입니다.*

이러한 동작은 axios의 validateStatus라는 설정의 기본값에 영향을 받기 때문인데요. 아래는 Axios 공식 문서에서 가져온 코드입니다. 기본적으로 status가 >= 200 && < 300 안에 포함되는 경우에 true, 그 외엔 false 처리가 됩니다. false 처리가 되면 Promise가 reject 처리 되어 catch 문으로 에러가 잡히게 된다고 보시면 됩니다.

// validateStatus config 옵션을 사용하면, 오류를 발생시키는 HTTP 코드를 정의할 수 있습니다.
axios.get('/user/12345', {
	validateStatus: function (status) {
		return status >= 200 && status < 300; // 상태 코드가 200 이상 300 미만인 경우에만 해결
	},
})

</aside>

에러 핸들링 | Axios Docs