コールバック地獄 — 右へ右へ伸びるピラミッド

非同期処理を「終わったらこれをやって」のコールバックでつないでいくと、処理が増えるほどインデントが右へ右へと伸びていきます。俗に「破滅のピラミッド（pyramid of doom）」と呼ばれる形です。

横にスクロール

症状：どう気づくか

• インデントが深く、コードが画面の右端へ流れていく三角形になっている。
• 閉じ括弧が }); }); }); と階段状に積み上がる。
• エラー処理が各段にバラバラに書かれ、抜けている段がある。

getUser(id, (err, user) => {
  if (err) return handle(err);
  getOrders(user, (err, orders) => {
    if (err) return handle(err);
    getItems(orders, (err, items) => {
      if (err) return handle(err);
      render(items);           // ← ここまで4段のネスト
    });
  });
});

なぜ悪いのか

読みにくさは表面的な問題です。本当に危ないのはエラー処理です。

コールバック方式では、各段で if (err) を自分で書かねばならず、1段でも書き忘れると、そこで起きた失敗が静かに消えます。さらに、コールバックが条件次第で呼ばれなかったり二重に呼ばれたりする実装ミスも起きやすい。制御フローが分散するため、「必ず1回だけ、成功か失敗のどちらかで終わる」という当たり前の保証が崩れます。

直し方

Promiseで平らな連鎖にする。 各処理がPromiseを返せば、.then で横に並べられ、エラーは末尾の .catch に集約できます。

getUser(id)
  .then((user) => getOrders(user))
  .then((orders) => getItems(orders))
  .then((items) => render(items))
  .catch(handle);              // 途中のどのエラーもここへ

async/awaitで同期的な見た目に戻す。 さらに読みやすくなり、try/catch という通常のエラー処理が使えます。

async function show(id) {
  try {
    const user = await getUser(id);
    const orders = await getOrders(user);
    const items = await getItems(orders);
    render(items);
  } catch (err) {
    handle(err);               // 全段まとめて捕捉
  }
}

まとめ

• コールバック地獄は、非同期を入れ子で積んだ結果できる右肩下がりのピラミッド。閉じ括弧の階段が兆候。
• 本当の害は読みにくさよりエラー処理の破綻。各段の if (err) 書き忘れで失敗が消え、二重呼び出しも起きやすい。
• 直し方はPromiseの平らな連鎖（.catch に集約）→ async/await（try/catch で同期的に）。
• 独立した処理は Promise.all で並行にして、直列の待ちを潰す。