Solusi TypeError: Cara Mengatasi Reduce Of Empty Array Javascript

Ditulis oleh JavaScript

Tambahkan nilai awal sebagai argumen kedua reduce() untuk mengatasi TypeError: Reduce of empty array with no initial value. Tanpa nilai awal, JavaScript memakai elemen pertama sebagai akumulator, sehingga array kosong tidak punya titik mulai dan langsung melempar error di browser maupun Node.js.

Penyebab Reduce Error pada Array Kosong

Pesan ini berarti reduce dipanggil tanpa initialValue pada array yang panjangnya nol. Runtime tidak bisa menentukan nilai awal akumulator, lalu menghentikan eksekusi dengan TypeError.

Bedakan tiga kondisi yang sering tertukar. Array kosong berarti []. Array berisi undefined seperti [undefined] tetap punya satu elemen sehingga tidak memicu error ini. Hasil filter() yang kosong juga berupa [], masalahnya baru terlihat ketika datanya ternyata tidak lolos filter.

  • Periksa data.length sebelum memanggil reduce.
  • Periksa apakah argumen kedua reduce sudah diisi.
  • Periksa apakah data berasal dari filter atau fetch API yang bisa kosong.

Tabel Troubleshooting Reduce Array Kosong

Error ini muncul identik di Chrome, Firefox, Safari, dan Node.js karena perilakunya diatur spesifikasi JavaScript, bukan oleh runtime tertentu.

Error/Kondisi Penyebab Solusi
Reduce array kosong tanpa initial value Akumulator tidak tersedia Tambahkan , 0 atau nilai awal sesuai tipe
Hasil filter kosong lalu di-reduce Filter tidak menemukan data cocok Validasi hasil filter atau beri nilai awal
Data fetch API kadang kosong Respons berupa [] Gunakan guard Array.isArray dan fallback

BACA JUGA:

Cara Memperbaiki Reduce dengan Initial Value

Ikuti urutan ini agar perbaikan tidak sekadar menutup error:

  1. Reproduksi error dengan data kosong memakai kode SALAH di bawah.
  2. Tambahkan initial value pada argumen kedua reduce.
  3. Validasi array memakai Array.isArray(data) sebelum perhitungan penting.
// SALAH: error jika total kosong
const total = [].reduce((a, b) => a + b);

// BENAR: penjumlahan aman
const totalAman = [].reduce((a, b) => a + b, 0);

// BENAR: total belanja dari data dinamis
const keranjang = [];
const totalBelanja = keranjang.reduce(
  (total, item) => total + item.harga,
  0
);

Nilai awal memberi akumulator yang pasti sejak iterasi pertama. JavaScript tidak perlu mengambil elemen pertama array, sehingga array kosong langsung mengembalikan nilai awal tersebut.

Cara Mencegah Error Terulang

  • Selalu pasang initial value: 0 untuk jumlah, "" untuk gabung string, [] atau {} untuk akumulasi koleksi.
  • Gunakan guard Array.isArray(data) bila data datang dari parameter fungsi atau library lain.
  • Tangani hasil filter API secara eksplisit karena isi respons bisa berubah setiap request.
  • Untuk data fetch, sediakan fallback seperti const list = await res.json() ?? []; lalu reduce dengan nilai awal.

FAQ

Apakah reduce selalu butuh initial value?

Tidak wajib, tetapi pasang selalu kecuali kamu yakin array tidak pernah kosong.

Kenapa reduce tetap error padahal array tidak kosong?

Kemungkinan variabelnya bukan array asli saat reduce berjalan, periksa lagi dengan Array.isArray.

Nilai awal apa yang tepat untuk reduce object?

Gunakan {} sebagai nilai awal agar hasil akumulasi selalu berupa object.

Artikel Terkait