FrontEnd에서의 에러 핸들링

오류(에러)란?

하드웨어의 고장 또는 소프트웨어가 본래의 동작을 할 수 없는 상태

  1. 컴파일 오류 (코드가 컴파일 될 때 컴파일러가 해석하지 못해서 발생)
  2. 런타임 오류 (프로그램이 동작할 때 발견할 수 있는 에러)

JavaScript 에서의 예외는 보통 런타임 오류를 일컫는다.


JavaScript와 컴파일 오류

JavaScript는 동적타입언어이기 때문에 프로그램이 동작할 때 동적으로 타입을 결정해주기 때문에
모든 에러가 컴파일 단계가 아닌 런타임 환경에서 발생할 수 있다.
(TypeScript를 통해서 런타임 전에 미리 캐치할 수 있는 오류들을 상당수 잡아낼 수 있다.)


예외란?

일반적으로 런타임 오류와 관련된 것으로 예상하기 어렵거나 예상이 불가능한 이슈를 의미

  • 예외가 발생하면 JavaScript는 Error 객체를 내보내고, 처리를 하지 않았다면 프로그램을 종료시킨다.

에러의 분류

예상이 가능한 에러

  • 인증 에러
  • 업는 페이지를 접근했을 때의 에러
  • 앱에서 정의한대로 API 응답의 상태코드로 예측할 수 있는 에러
  • 악의적인 목적으로 접근했을 때 이를 보완하는 코드가 프로그램에 내재되어 있지 않은 경우

예상이 불가능한 에러

  • 서비스 장애
  • 네트워크가 일시적으로 불안정한 상황에서 발생하는 에러
  • 500대 에러

Try - Catch - Finally

  • Try : 에러가 발생할 수도 있는 로직 작성. 에러를 직접 Throw 할 수도 있음
  • Catch : 에러 잡기
  • Finally : 로직이 끝나고 무조건 해당 구문을 실행시킴

에러핸들링에 대한 고찰

무조건 try-catch를 사용하는 것을 지양해야한다!

  • catch에 넘겨지는 error객체의 타입을 보장할 수 없음
  • 오류를 해결하는 것이 아닌 숨기는 것임
  • try-catch를 통해 유의미한 결과를 내보낼 수 없다면 에러를 터뜨리는 것이 나을수도 있다.

참고

[10분 테코톡] 🌼티케의 프론트엔드에서의 에러 핸들링open in new window

Last Updated: