Apa Saja 5 Contoh Reduce

5 min read Jun 27, 2024
Apa Saja 5 Contoh Reduce

5 Contoh Reduce dalam JavaScript untuk Mempermudah Codingmu

Reduce adalah metode array yang sangat kuat dalam JavaScript. Dengan reduce, kamu bisa memproses seluruh elemen array dan mengubahnya menjadi sebuah nilai tunggal.

Bayangkan kamu punya daftar belanja, dan kamu ingin menghitung total harga. Reduce bisa membantu kamu dengan mudah!

Yuk, kita lihat beberapa contohnya:

1. Mencari Total Harga

Misalnya, kamu punya array berisi harga barang belanjaan:

const hargaBarang = [10000, 25000, 15000, 5000];

Dengan reduce, kamu bisa menghitung totalnya:

const totalHarga = hargaBarang.reduce((total, harga) => total + harga, 0);

console.log(totalHarga); // Output: 55000

Penjelasan:

  • reduce menerima dua parameter: sebuah fungsi callback dan nilai awal.
  • Fungsi callback menerima dua parameter: total (akumulator) dan harga (elemen array).
  • total + harga adalah operasi yang dilakukan pada setiap iterasi.
  • 0 adalah nilai awal (accumulator).

2. Menemukan Nilai Maksimum

Misalnya kamu ingin mencari nilai terbesar dalam array:

const angka = [10, 5, 20, 15];

const nilaiMax = angka.reduce((max, angka) => (max > angka ? max : angka), 0);

console.log(nilaiMax); // Output: 20

Penjelasan:

  • max > angka ? max : angka adalah operator ternary.
  • Jika max lebih besar dari angka, maka max disimpan.
  • Jika tidak, angka disimpan.

3. Menghitung Frekuensi Karakter

Misalnya, kamu ingin menghitung frekuensi kemunculan karakter dalam sebuah string:

const kalimat = "hello world";

const frekuensiKarakter = kalimat.split("").reduce((obj, char) => {
  obj[char] = (obj[char] || 0) + 1;
  return obj;
}, {});

console.log(frekuensiKarakter); 
// Output: { h: 1, e: 1, l: 3, o: 2,  w: 1, r: 1, d: 1 }

Penjelasan:

  • split("") mengubah string menjadi array karakter.
  • Objek obj digunakan untuk menyimpan frekuensi setiap karakter.
  • obj[char] = (obj[char] || 0) + 1 menambahkan 1 ke frekuensi karakter yang ditemukan.

4. Menggabungkan Array

Misalnya, kamu ingin menggabungkan beberapa array menjadi satu array:

const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const array3 = [7, 8, 9];

const gabunganArray = [array1, array2, array3].reduce(
  (gabungan, array) => gabungan.concat(array),
  []
);

console.log(gabunganArray); // Output: [1, 2, 3, 4, 5, 6, 7, 8, 9]

Penjelasan:

  • concat menggabungkan array.
  • [] adalah array kosong sebagai nilai awal.

5. Mengelompokkan Data

Misalnya, kamu ingin mengelompokkan data berdasarkan kategori:

const data = [
  { name: "Budi", category: "A" },
  { name: "Joko", category: "B" },
  { name: "Siti", category: "A" },
  { name: "Tono", category: "B" },
];

const dataKelompok = data.reduce((kelompok, item) => {
  const kategori = item.category;
  if (!kelompok[kategori]) {
    kelompok[kategori] = [];
  }
  kelompok[kategori].push(item);
  return kelompok;
}, {});

console.log(dataKelompok);
// Output: { A: [{ name: "Budi", category: "A" }, { name: "Siti", category: "A" }], B: [{ name: "Joko", category: "B" }, { name: "Tono", category: "B" }] }

Penjelasan:

  • Objek kelompok digunakan untuk menyimpan data yang dikelompokkan berdasarkan kategori.
  • if (!kelompok[kategori]) { kelompok[kategori] = []; } menambahkan kategori baru ke objek jika belum ada.

Dengan contoh-contoh di atas, kamu bisa melihat bagaimana reduce bisa sangat berguna dalam memproses array dan melakukan berbagai operasi dengan lebih mudah.

Semoga bermanfaat!

Related Post