밧드의 프론트엔드에서의 에러핸들링

에러 핸들링이란

코드 실행 -> 에러 발생 -> 예외처리 -> 실행 흐름 복구
- 코드가 실행되고 예상하거나 예상치 못했던 상황에서 에러가 발생했을 때 자바스크립트에서 지원하는 기본적인 기능들로 예외 처리를 하여 애플리케이션이 중단되는 것을 막고 실행 흐름이 이어 갈 수 있도록 복구하는 것을 말한다.
에러 핸들링의 중요성
- 안정적인 서비스
- 사용자 경험
에러의 종류
- 컴파일 에러
  - 잘못된 구문
  - 유효하지 않은 자료형
  - 등등
- 런타임 에러
  - Undefined 객체의 속성 참조
  - 무한루프
  - 등등
자바스크립트 에러 객체
- - Error: 기본적인 에러 객체
  - SynTaxError: 문법이 틀렸을 때 발생하는 객체
  - ReferenceError: 잘못된 참조를 했을 때 발생하는 객체
  - RangeError: 숫자 변수가 범위를 벗어났을 때 발행하는 객체
에러 발생 과정
- 선언되지 않는 변수를 실행시키려고 할 때 자바스크립트 엔진은 ReferenceError 스택 등이 담겨있는 new Error 객체를 생성하여 throw 한다. throw 되면은 호출 함수의 되감기 과정이 발생하여 전역 실행 컨텍스트까지 도달하면은 전역 에러를 발생시키고 프로그램은 종료된다.

try/catch 방법
비동기 로직에서 try/catch 주의할 점
- await 가 빠지면 에러 catch 를 못한다.
사용자 지정 에러
- 임의로 에러를 발생시켜 줄 수 있는데 적절한 에러를 발생시키고 에러처리를 한다면 더 안전한 코드를 잘성 할 수 있다.
- 에러가 발생할 확률이 높은 곳에 에러 처리를 하고 에러 핸들러를 처리하는 과정을 작성한다면은 나중에 에러가 발생했을 때 에러가 어떻게 발생했는지 그리고 디버깅할 때 에러의 위치를 빠르게 파악할 수 있다.
try/catch 를 많이 사용하면 좋지 않을까?
- try/catch 를 많이 사용하면은 분기처리가 되지 않기 때문에 어디서 에러가 발생하는 지 파악하기 힘들고 빠르게 에러를 처리하는 데에 유지보수하기에 걸림돌이 될 수 있다.
상황에 따른 처리 방법
- 에러 페이지
- 메세지
- 별도 처리 없음
- 섬세하게 처리할 필요가 있고 뭉뚱그려 try/catch 를 하는 것 보다 어디서 오류가 발생하면 좋을지 그리고 시나리오를 작성하여 정리해 놓으면 나중에 에러를 작성하는 데에서 도움을 받을 수 있다.