Error Handling — JavaScript

Pernah liat aplikasi yang langsung crash putih total pas ada masalah kecil? Itu app yang gak punya error handling — satu hiccup, semuanya runtuh. App profesiona

Pernah liat aplikasi yang langsung crash putih total pas ada masalah kecil? Itu app yang gak punya error handling — satu hiccup, semuanya runtuh. App profesional? Tetep jalan tegar walau ada drama di belakang layar — user dikasih pesan ramah ("ada gangguan, coba lagi") bukan layar putih horor.

try...catch itu sabuk pengaman kamu. try bilang "coba jalanin kode ini, mungkin ada masalah." catch bilang "kalau emang masalah, ini cara nanganinnya." Programnya tetep hidup, user tetep bisa ngelanjut kerja.

💡 Error handling = empati developer. Kode yang gak punya error handling = kamu nyerahin nasib user ke nasib. Kode yang handle error baik = kamu mikirin "kalau gagal, gimana caranya user tetep bisa kerja?"

try {
  // kode yang mungkin error
  const data = JSON.parse("bukan json");
} catch (error) {
  // tangani error
  console.log("Terjadi error:", error.message);
}

Struktur lengkap: try...catch...finally

try {
  // coba jalankan
  const hasil = riskyOperation();
} catch (error) {
  // jika error
  console.log("Error:", error.message);
} finally {
  // selalu dijalankan (error atau tidak)
  console.log("Selesai");
}

Melempar error sendiri:

function bagi(a, b) {
  if (b === 0) {
    throw new Error("Tidak bisa membagi dengan nol!");
  }
  return a / b;
}

Tips:

🎭 Analogi sehari-hari

try...catch = bawa payung keluar rumah. try = jalan biasa. catch = pas hujan, payung dibuka, kamu tetap jalan tanpa basah. finally = pas sampai rumah, payung dilipat (selalu, hujan atau tidak).

⚠️ Jebakan yang sering ditemui

1. try/catch TIDAK menangkap error async tanpa await.

try {
  fetch("/x").then(r => r.bukanMethod());  // ❌ tidak ditangkap
} catch (e) { /* tidak jalan */ }

try {
  await fetch("/x");                       // ✅ kalau pakai await
} catch (e) { /* jalan */ }

2. catch terlalu lebar = sembunyikan bug.

try { lakukanBanyakHal(); }
catch (e) { /* diem */ }    // ❌ semua error hilang, debug pusing

Lebih baik catch spesifik atau minimal console.error(e).

3. throw string vs throw new Error().

throw "kesalahan";              // ❌ tidak ada stack trace
throw new Error("kesalahan");   // ✅ ada stack trace, gampang debug

🎯 try/catch vs return-null vs Result pattern — pilih yang mana?

  • Operasi pasti error sometimes (parse JSON, network, file I/O) → try/catch
  • Validasi yang "expected to fail" (form input invalid) → return { ok: false, error: "..." }
  • Lookup yang mungkin gak ada → return null + cek di caller (if (!result) ...)
  • Kode kritis production (payment, auth) → kombinasi: try/catch + log + retry strategy

Anti-pattern: try { } catch (e) {} (silent swallow) — bug menghilang, debug pusing. Minimal console.error(e). Atau lempar ulang setelah cleanup: throw e.

TL;DR: try/catch/finally = sabuk pengaman. try jalanin kode beresiko, catch tangani error, finally selalu jalan (cleanup). Pakai throw new Error("...") BUKAN throw "..." (stack trace). Async error ketangkep cuma dengan await (atau .catch() di Promise). Anti-pattern: silent catch (catch (e) {}) — bug hilang, debug pusing. Minimal console.error(e) atau lempar ulang.

Yang akan kamu pelajari