async/await Error Handling Best Practices in JavaScript

async/await Error Handling Best Practices in JavaScript

try/catch with await is the cleanest error handling for async code. Here are the best practices.

1. Always Use try/catch

async function main() {
  try {
    const data = await fetch("/api");
    render(data);
  } catch (err) {
    console.error(err);
  }
}

2. Recover with Fallbacks

async function main() {
  let data;
  try {
    data = await fetch("/api");
  } catch {
    data = fallbackData;
  }
  render(data);
}

3. Re-throw to Propagate

async function fetchUser(id) {
  try {
    const res = await fetch(`/api/${id}`);
    return res.json();
  } catch (err) {
    console.error("fetchUser failed:", err);
    throw err; // propagate to caller
  }
}

4. Do Not Swallow Errors

// bad: swallowing
try { await fetch("/api"); } catch {}

// good: at least log
try { await fetch("/api"); } catch (err) { console.error(err); }

5. Use a Helper for Go-style Error Handling

async function to(promise) {
  try {
    const data = await promise;
    return [data, null];
  } catch (err) {
    return [null, err];
  }
}

const [data, err] = await to(fetch("/api"));
if (err) handleError(err);
else render(data);

The Takeaway

Always use try/catch with await. Recover with fallbacks. Re-throw to propagate. Do not swallow errors. Use a to(promise) helper for Go-style error handling (avoids nested try/catch).