JavaScript | 再帰とループの性能比較

では「ループと再帰の性能差」をイメージできるように、大量データを処理した場合のシミュレーション的な比較をしてみましょう。

例題：配列の合計（100万要素）

ループ版

function sumLoop(arr) {
  let sum = 0;
  for (let i = 0; i < arr.length; i++) {
    sum += arr[i];
  }
  return sum;
}

function sumLoop(arr) {
  let sum = 0;
  for (let i = 0; i < arr.length; i++) {
    sum += arr[i];
  }
  return sum;
}

• 処理の流れ: 1つの関数の中で変数を更新し続けるだけ
• 関数呼び出し回数: 1回
• 速度: 高速（関数呼び出しのオーバーヘッドがない）
• メモリ使用量: 少ない

再帰版

function sumRec(arr, i = 0) {
  if (i === arr.length) return 0;
  return arr[i] + sumRec(arr, i + 1);
}

function sumRec(arr, i = 0) {
  if (i === arr.length) return 0;
  return arr[i] + sumRec(arr, i + 1);
}

• 処理の流れ: 要素ごとに関数を呼び出す
• 関数呼び出し回数: 配列の長さ分（100万回）
• 速度: 遅い（呼び出しオーバーヘッドが積み重なる）
• メモリ使用量: 大きい（呼び出しスタックが100万段積まれる）
• 結果: JavaScript では「スタックオーバーフロー」でエラーになる可能性大

性能の違いまとめ

✅ 結論

• 大量データや単純な繰り返し → ループが圧倒的に有利
• 入れ子構造や分割統治アルゴリズム → 再帰がシンプルで分かりやすい

👉 ここまでで「性能面での違い」が見えました。