비동기 코드를 포함해 JavaScript에서 에러를 어떻게 처리하나요?

Question

IT Interview Practice · Accepted Answer

동기 에러는 **`try/catch/finally`**를 사용하며, 스택 트레이스를 얻기 위해 (문자열이 아니라) `Error` 객체를 `throw`해야 합니다.

```js
try {
  const data = JSON.parse(input);
} catch (err) {
  if (err instanceof SyntaxError) handleBadJson(err);
  else throw err;        // 처리할 수 없는 것은 다시 throw
} finally {
  cleanup();             // 항상 실행
}
```

## 비동기 에러 처리는 스타일에 따라 다르다

```js
// async/await → await를 try/catch로 감싼다
async function load() {
  try {
    return await fetch(url).then(r => r.json());
  } catch (err) { showError(err); }
}

// promise → .catch 사용
fetch(url).then(use).catch(showError);
```

## 흔한 함정: try/catch는 비동기 콜백을 잡지 못한다

```js
try {
  setTimeout(() => { throw new Error("boom"); }, 0); // ❌ 잡히지 않음
} catch (e) { /* 절대 실행 안 됨 — throw는 나중에, 이 스택 밖에서 발생 */ }
```

`setTimeout` 콜백은 나중 틱에 실행되므로, 둘러싼 `try`는 이미 사라진 지 오래입니다. 에러는 콜백 *내부*에서 처리하세요.

## 전역 안전망

```js
window.addEventListener("unhandledrejection", e => log(e.reason)); // 브라우저
process.on("unhandledRejection", err => log(err));                 // Node
```

## 모범 사례

- 스택 트레이스와 `instanceof` 검사를 위해 `Error`(또는 커스텀 서브클래스)를 throw하세요.
- 복구 가능한 곳에서 **구체적으로** 잡고, 예상치 못한 에러는 위로 전파되게 하세요.
- 절대 에러를 조용히 삼키지 마세요(`catch (e) {}`). 항상 로깅하거나 다시 throw하세요.

비동기 에러 처리는 스타일에 따라 다르다

흔한 함정: try/catch는 비동기 콜백을 잡지 못한다

전역 안전망

모범 사례

관련 질문