모던 자바스크립트 : 에러처리

1. 에러 처리의 필요성

• 발생한 에러를 방치하면 프로그램은 강제 종료됨
  • try...catch 문을 사용해 발생한 에러에 적절하게 대응하면 프로그램이 강제 종료되지 않고 계속해서 코드 실행 가능
• 직접적으로 에러를 발생하지는 않는 예외적인 상황 발생할 수 있음
  • 예외적인 상황에 적절하게 대응하지 않으면 에러로 이어질 수 있음

 

2. try...catch...finally 문

a. 에러 처리를 구현하는 방법

1. querySelector, Arry#find 메서드처럼 예외적인 상황이 발생하면 반환하는 값(null / -1)을 if 문이나 단축 평가 또는 옵셔널 체이닝 연산자를 통해 확인해서 처리하는 방법
2. 에러 처리 코드를 미리 등록해두고 에러가 발생하면 에러 처리 코드로 점프하도록 하는 방법

b. 그 중 try...catch...finally 문은 2번

• try...catch...finally 문은 3개의 코드 블록으로 구성됨
  • finally 문은 불필요하면 생략 가능
  • catch 문도 생략 가능하지만 catch 문이 없는 try 문은 의미가 없는거라서 생략 ✕

c. try...catch...finally 문을 실행하면 try 코드 블록 실행

• 이때 try 코드 블록에 포함된 문 중에서 에러가 발생하면 발생한 에러는 catch 문의 err 변수에 전달되고 catch 코드 블록 실행
• catch 문의 err 변수(변수 이름은 노상관)는 try 코드 블록에 포함된 문 중에서 에러 발생하면 생성되고 catch 코드 블록에서만 유효
• finally 코드 블록은 에러 발생과 상과없이 한번만 실행

 

3. Error 객체

a. Error 생성자 함수

• Error 생성자 함수에는 에러를 상세히 설명하는 에러 메세지를 인수로 전달 가능

b. Error 생성자 함수는 여러 객체 생성

• Error 생성자 함수가 생성한 에러 객체는 message 프로퍼티와 stack 프로퍼티 가짐
• message 프로퍼티 값은 Error 생성자 함수에 인수로 전달한 에러메세지
• stack 프로퍼티 값은 에러를 발생시킨 콜 스택의 호출 정보를 나타내는 문자열이며 디버깅 목적으로 사용

c. 7가지의 에러 객체를 생성할 수 있는 Error 생성자 함수

• 자바스크립트는 Error 생성자 함수를 포함해 7가지의 에러 객체를 생성할 수 있는 Error 생성자 함수 제공
• SyntaxError, ReferenceError, TypeError, RangeError, URIError, EvalError 생성자 함수가 생성한 에러 객체의 프로토타입은 모두 Error.prototype을 상속 받음

 

4. throw 문

a. throw 문

• Error 생성자 함수로 에러 객체를 생성하다고 에러가 발생하는 것은 아님
• 에러를 발생시키려면 try 코드 블록에서 throw 문으로 여러 객체를 던져야함
• throw 문의 표현식은 어떤 값이라로 상관없지만 일반적으로 에러 객체 지정

b. Error 발생시키는 순서

1. 에러를 던지면 catch 문의 에러 변수가 생성되고 던져진 에러 객체 할당
2. catch 코드 블록 실행 시작

 

5. 에러의 전파

a. 에러는 호출자 방향으로 전파 = 콜 스택의 아래 방향으로 전파

• ①에서 baz 함수 호출하면 ②에서 bar 함수가 호출되고 ③에서 foo 함수가 호출되고 foo 함수는 ④에서 에러 throw
• 이때 foo 함수가 throw한 에러는 다음과 같이 호출자에게 전파되어 전역에서 캐치

b. 비동기 함수인 setTimeout이나 프로미스 후속 처리 메서드의 콜백 함수는 호출자가 없음

• setTimeout이나 프로미스 후속 처리 메서드의 콜백 함수는 태스크 큐나 마이크로태스크 큐에 일시 저장되었다가 콜 스택이 비면 이벤트 루프에 의해 콜 스택으로 푸시되어 실행
• 이때 콜 스택에 푸시된 콜백함수의 실행 컨텍스트는 콜 스택의 가장 하부에 존재 => 에러 전파할 호출자가 없음

 

 

 

모던 자바스크립트 딥다이브 책을 정리한 내용입니다!!