공부하다보면 간간히 try...catch문에 대한 얘기가 나오는데 정작 나는 써본 적이 없다.
사용법은 MDN만 봐도 금방 나오는데 이걸 그래서 어디에 쓰면 좋을지, 활용처가 궁금했다. 그 동안엔 그냥 if, if else문으로 퉁쳤으니까ㅎㅎ

📌 try ... catch문 사용법

try ... cahch

일단 try catch문을 한마디로 정의하자만 예외발생 상황 지정이라 할 수 있지 않을까 싶다.

일단 try안에는 기본적으로 실행할 문장이 들어오고, catch안에는 try에서 실행하다가 예외(에러 등) 상황이 발생시 throw된 상황에 대한 응답문이 들어간다.

try {
  alert('문제없이 실행됐습니다.');
} catch (err) {
  alert('무시된 블럭입니다.');
}

위를 실행하면 try문의 내용에 문제될 것이 없기 때문에 그대로 실행되고, catch문의 내용은 무시된다.

즉, catch문의 내용은 예외 발생시에만 실행되는 것.

try {
  정의되지않은문장;	// err발생 부분
  alert('문제없이 실행됐습니다.');
} catch (err) {
  alert('문제가 있네요?');
}

위 코드를 실행하면 alert창에 '문제가 있네요?'란 결과가 나온다.

🚨 주의: 예외상황 발생 전까지의 try문은 실행된다.

이때 주의할 점은 catch로 throw되는 시점은 예외 발생 시점이라는 것.
즉, 아래 같은 코드를 실행하면?

try {
  alert('문제없이 실행됐습니다.');
  정의되지않은문장;	// err발생 부분
  alert('무시되는 코드');
} catch (err) {
  alert('문제가 있네요?');
}

첫번째 alert는 실행되지만 그 다음에 바로 에러가 발생했으므로 catch문으로 throw된다.

---

catch문의 매개변수

catch문 안에는 error에 대한 매개변수를 지니고, 여기엔 에러에 대한 객체가 들어온다.
변수명은 우리가 임의로 설정 가능하다.

try {
  nonExistentFunction();
} catch (err) {
  console.error(err);
}

위 코드는 MDN에 예시로 있는 코드이다. 실행하면 콘솔창에 err에 대한 message가 나온다.

이렇게 들어오는 변수는 몇가지 값을 지니는데 다음과 같다.

name: 에러이름

message: error에 대한 상세 내용

여기까지가 주요한 표준(?) property값이고 비표준 값으로 많이 가지는 것이 하나 더있다.

stack: 에러 발생 위치

그렇기 때문에 error 전체를 띄울 수도 있고, 각 프로퍼티 값을 띄울 수도 있다.

try {
  에러발생
} catch(err) {
  alert(err.name);
  alert(err.message);
  alert(err.stack);

  alert(err);
}

근데 err로 전체를 띄울 때는 stack이 표준이 아니라 그런지 name: message의 형태만 나온다.

이 개매변수는 생략하는 것도 가능하다.

try {
  // ...
} catch {
  // err의 정보를 받을 필요가 그닥 없다면 생략
}

---

throw: 강제로 원할 때 catch문 실행

원할 때 catch문을 실행하는 것도 가능하다. 이땐 try문 안에서 throw문를 실행하는 것.

throw라는 이름 그대로 원하는 걸 catch로 던져주는 것인데 보통은 실제 에러 발생시 매개변수로 던져지는 객체처럼 name과 message를 지니도록 하는 것이 좋다.

이때는 JS에 기본내장되어있는 error관련 생성자를 활용하자

let error = new Error(message);
// or
let error = new SyntaxError(message);
let error = new ReferenceError(message);

이를 이용해보면 다음과 같다.

try {
  alert('문제없이 실행됐습니다.');
  throw new Error('원하는 에러 메세지');
} catch (err) {
  alert(err);	// Error: 원하는 에러 메세지
}

rethrowing ?

catch문에서 throw를 사용하는 rethrowing도 있는데 이는 내가 짧게 요약하기 어려울 것 같아서 내가 글을 쓰며 참고했던 링크로 가서 직접 예시를 보는 것이 좋을 것 같다.

설명을 매우 잘 해주셨다! 👍👍👍

---

finally

추가적으로 finally가 있는데 이는 예외 발생여부와 상관없이 무조건적으로 실행되는 코드의 내용이다.

try {
  alert('문제없이 실행됐습니다.');
} catch (err) {
  alert('무시된 블럭입니다.');
} finally {
  alert('실행을 마칩니다.');
}

위 코드는 catch문의 alert를 빼고 모두 실행된다.

try ~~문 형태

try문은 catch문과 finally문 둘 중 하나를 반드시 지녀야한다. 물론 둘다도 가능하다.

1. try ... catch
2. try ... finally
3. try ... catch ... finally

---

📌 try ... catch문의 효용

그럼 얘는 어따 쓰지? 이 문법이 지니는 장점은 error의 헨들링을 통해 스크립트가 죽어버리는(?) 것을 막을 수 있다는 것이다.

그냥 작성된 스크립트문에 에러가 발생했을 시엔 그냥 전체가 죽어서 실행이 막히지만 이 문법을 사용하면 에러 발생 상황의 대비문이 있기 때문에 문제없이 나머지를 실행할 수 있다는 것이다.

이에 대한 자세한 설명은 JAVASCRIPT.INFO에 예시가 잘 설명되어 있으니 이를 참고하면 좋다!

🚨 위에서 언급했던 rethrow에 대한 예시가 있는 곳

문법 자체는 단순하고 쉬워보였는데 활용할라치면 무궁무진하고, 딥해지니 쉽지 않다.. 허허

역시 예시말고 실상황에서도 써봐야 익숙해지겠지?

---

• 참고:
  • MDN문서: try...catch - Javascript
  • JAVASCRIPT.INFO - 'try..catch'와 에러 핸들링