Pelajari iterasi array JavaScript lengkap seperti forEach(), map(), filter(), reduce(), find(), every(), some(), dan lainnya.

Iterasi Array JavaScript Lengkap untuk Pemula

Pembukaan

Iterasi array JavaScript digunakan untuk memproses data array secara otomatis. Teknik ini sangat penting dalam pengembangan website modern karena mempermudah pengolahan data monitoring CCTV, analytic camera system, dashboard server, dan jaringan realtime.

Dalam sistem profesional seperti Haikal IT Support, iterasi array digunakan untuk:

• Monitoring perangkat CCTV

• Analytic camera report

• Statistik jaringan

• Dashboard server realtime

• Data filtering perangkat

Berikut penjelasan lengkap iterasi array JavaScript.

---

1. Array.forEach()

forEach() digunakan untuk menjalankan function pada setiap elemen array.

Contoh Kode

let perangkat = [
  "CCTV",
  "Server",
  "Router"
];

perangkat.forEach(function(item) {

  console.log(item);

});

Hasil Demo

CCTV
Server
Router

Penjelasan

• forEach() hanya melakukan iterasi.

• Tidak menghasilkan array baru.

---

2. Array.map()

map() membuat array baru dari hasil proses.

Contoh Kode

let angka = [1, 2, 3];

let hasil = angka.map(function(item) {

  return item * 2;

});

console.log(hasil);

Hasil Demo

[2, 4, 6]

Penjelasan

• Setiap elemen dikalikan 2.

• Menghasilkan array baru.

---

3. Array.filter()

filter() digunakan untuk menyaring data.

Contoh Kode

let angka = [10, 20, 30, 40];

let hasil = angka.filter(function(item) {

  return item > 20;

});

console.log(hasil);

Hasil Demo

[30, 40]

Penjelasan

• Hanya data lebih dari 20 yang diambil.

---

4. Array.reduce()

reduce() digunakan untuk menghitung total data.

Contoh Kode

let angka = [10, 20, 30];

let hasil = angka.reduce(function(total, item) {

  return total + item;

});

console.log(hasil);

Hasil Demo

60

Penjelasan

Rumus reduce:

\text{Total} = a + b + c + ...

---

5. Array.reduceRight()

reduceRight() bekerja dari kanan ke kiri.

Contoh Kode

let angka = ["CCTV", "Server", "Router"];

let hasil = angka.reduceRight(function(total, item) {

  return total + " - " + item;

});

console.log(hasil);

Hasil Demo

Router - Server - CCTV

Penjelasan

• Iterasi dimulai dari elemen terakhir.

---

6. Array.every()

every() mengecek apakah semua data memenuhi kondisi.

Contoh Kode

let angka = [10, 20, 30];

let hasil = angka.every(function(item) {

  return item > 5;

});

console.log(hasil);

Hasil Demo

true

Penjelasan

• Semua angka lebih besar dari 5.

---

7. Array.some()

some() mengecek apakah ada minimal satu data yang memenuhi kondisi.

Contoh Kode

let angka = [10, 20, 30];

let hasil = angka.some(function(item) {

  return item > 25;

});

console.log(hasil);

Hasil Demo

true

Penjelasan

• Ada angka lebih dari 25.

---

8. Array.indexOf()

indexOf() mencari posisi data pertama.

Contoh Kode

let perangkat = [
  "CCTV",
  "Server",
  "Router"
];

console.log(perangkat.indexOf("Server"));

Hasil Demo

1

Penjelasan

• Index dimulai dari 0.

---

9. Array.lastIndexOf()

lastIndexOf() mencari posisi terakhir data.

Contoh Kode

let angka = [10, 20, 10, 30];

console.log(angka.lastIndexOf(10));

Hasil Demo

2

Penjelasan

• Mengambil index terakhir dari nilai 10.

---

10. Array.find()

find() mencari data pertama yang cocok.

Contoh Kode

let angka = [10, 20, 30];

let hasil = angka.find(function(item) {

  return item > 15;

});

console.log(hasil);

Hasil Demo

20

Penjelasan

• Mengembalikan nilai pertama yang cocok.

---

11. Array.findIndex()

findIndex() mencari index data pertama yang cocok.

Contoh Kode

let angka = [10, 20, 30];

let hasil = angka.findIndex(function(item) {

  return item > 15;

});

console.log(hasil);

Hasil Demo

1

Penjelasan

• 20 berada di index 1.

---

Penyebab Error Iterasi Array

Beberapa kesalahan umum:

• Data bukan array

• Salah penulisan callback function

• Tidak menggunakan return

• Array kosong

---

Cara Mengatasi Error Iterasi

1. Pastikan Data adalah Array

Contoh Kode

console.log(Array.isArray(perangkat));

Hasil Demo

true

---

2. Gunakan Return pada map/filter/reduce

Salah:

angka.map(function(item) {

  item * 2;

});

Benar:

angka.map(function(item) {

  return item * 2;

});

---

Contoh Kasus

Kasus:

Dashboard monitoring CCTV perlu menampilkan kamera aktif saja.

Solusi:

Gunakan filter().

Contoh Kode

let camera = [

  {nama:"CCTV 1", aktif:true},

  {nama:"CCTV 2", aktif:false},

  {nama:"CCTV 3", aktif:true}

];

let aktif = camera.filter(function(item) {

  return item.aktif;

});

console.log(aktif);

Hasil Demo

[
 {nama:"CCTV 1", aktif:true},
 {nama:"CCTV 3", aktif:true}
]

---

Tips Tambahan

• Gunakan map() untuk transformasi data.

• Gunakan filter() untuk pencarian data.

• Gunakan reduce() untuk total statistik.

• Gunakan find() untuk pencarian cepat.

---

Internal Link

Artikel terkait di Haikal IT Support:

• Array JavaScript

• Metode Array JavaScript

• Pengurutan Array JavaScript

• Fungsi JavaScript

• Dasar JavaScript

---

Kesimpulan

Iterasi array JavaScript mempermudah pengolahan data dalam aplikasi modern. JavaScript menyediakan banyak metode seperti forEach(), map(), filter(), reduce(), find(), dan some() untuk manipulasi data secara efisien.

Pemahaman iterasi array sangat penting dalam pengembangan dashboard monitoring CCTV, analytic camera system, server management, dan network system profesional di Haikal IT Support.