Array dalam JavaScript: Pengertian, Contoh, & Metode

Array dalam JavaScript: Pengertian, Contoh, & Metode

Array dalam JavaScript adalah struktur data berbentuk daftar terurut yang menyimpan banyak nilai dan memudahkan kita mengelola data secara efisien.

Halo teman-teman, di dunia frontend maupun backend, array itu ibarat rak serbaguna tempat kalian menaruh apa saja: angka, string, objek, hingga fungsi. Pada artikel ini analiswinter.com akan membahas cara kerja, pembuatan, metode penting, serta praktik terbaik agar kalian makin luwes mengolah data.

Array Dalam JavaScript

Pengertian Singkat

Array adalah kumpulan nilai yang disimpan dalam satu variabel dan diakses melalui indeks yang dimulai dari 0. JavaScript memperlakukan array sebagai objek khusus sehingga sangat fleksibel.

const campuran = [1, "apel", true, {id: 1}, function() { return "hai" }];
console.log(campuran[0]);

Cara Membuat Array

  1. Literal array
const angka = [10, 20, 30];
  1. Konstruktor Array
const kosong = new Array(3);
const dariArg = Array.of(1, 2, 3);
const dariLike = Array.from("halo");

Operasi Dasar

  1. Menambah di akhir
const buah = ["mangga"]; buah.push("jeruk");
  1. Menghapus di akhir
buah.pop();
  1. Menambah di awal
buah.unshift("apel");
  1. Menghapus di awal
buah.shift();
  1. Mengiris sebagian
const subset = buah.slice(0, 1);
  1. Menyisipkan atau menghapus di tengah
buah.splice(1, 0, "pisang");

Metode Umum Dan Kapan Dipakai

MetodeFungsiContoh
mapMengubah setiap elemen menjadi nilai baru tanpa merusak array asal[1,2,3].map(x => x*2)
filterMenyaring elemen yang memenuhi kondisi[1,2,3].filter(x => x%2===1)
reduceMengakumulasi semua elemen menjadi satu nilai[1,2,3].reduce((a,b)=>a+b,0)
findMengambil elemen pertama yang cocok[2,4,5].find(x => x>3)
someCek apakah ada yang memenuhi[1,2].some(x=>x>1)
everyCek semua harus memenuhi[2,4].every(x=>x%2===0)
sortMengurutkan elemen dengan komparator[3,1,2].sort((a,b)=>a-b)
includesMemeriksa keberadaan nilai["a","b"].includes("a")

Iterasi Modern

Gunakan for...of untuk berjalan di nilai, dan forEach untuk side-effect cepat.

const users = ["Ana", "Budi", "Cici"];
for (const u of users) {
  console.log(u);
}
users.forEach((u, i) => console.log(i, u));

Immutability Tip

Metode seperti map, filter, slice, dan concat membuat array baru sehingga aman untuk state UI. Hindari mutasi langsung saat memakai library reaktif.

const a = [1,2,3];
const b = a.map(x => x+1); // a tetap [1,2,3]

Perbedaan slice Vs splice

slice menghasilkan salinan sebagian tanpa mengubah array asli. splice memodifikasi array asli dengan menambah atau menghapus elemen.

const arr = ["x","y","z"];
const s1 = arr.slice(0,2); // ["x","y"], arr tetap
arr.splice(1,1,"YY"); // arr menjadi ["x","YY","z"]

FAQ – Array Dalam JavaScript

1) Apa Bedanya Array Dan Object Untuk Menyimpan Data?

Jawaban: Array cocok untuk data berurutan/terindeks (0,1,2,…) dan operasi seperti iterasi, pemetaan, penyaringan. Object cocok untuk pasangan kunci–nilai. Kalian bisa menggabungkan keduanya: array berisi objek.

const users = [ {id:1, nama:"Ana"}, {id:2, nama:"Budi"} ]; // array of objects
const indeks = { Ana: 1, Budi: 2 };                          // object sebagai lookup

2) Kenapa sort() Suka “aneh” Saat Mengurutkan Angka?

Jawaban: Default sort() membandingkan sebagai string (leksikografis), jadi 10 bisa diletakkan sebelum 2. Gunakan komparator numerik atau metode baru non-mutating toSorted (jika tersedia).

const nums = [3,10,2,21,1];
nums.sort();            // [1,10,2,21,3] (salah untuk angka)
nums.sort((a,b)=>a-b);  // [1,2,3,10,21]
// Non-mutating (ES2023+):
const sorted = nums.toSorted((a,b)=>a-b);

3) Kapan Pakai map() Vs forEach()?

Jawaban: map() dipakai saat kalian ingin membuat array baru dari transformasi setiap elemen; jangan dipakai hanya untuk side-effect. forEach() cocok untuk menjalankan aksi (log, DOM, dsb.) tanpa membutuhkan nilai balik.

const prices = [10,20,30];
const withTax = prices.map(p => p*1.11); // hasil baru
prices.forEach(p => console.log(p));     // sekadar efek samping

4) Apa Perbedaan slice() Dan splice()?

Jawaban: slice(start, end) tidak memodifikasi array asal (menghasilkan salinan sebagian). splice(start, deleteCount, ...insert) memodifikasi array asal.

const a = ["x","y","z"];
const b = a.slice(0,2);     // b=["x","y"], a tetap sama
a.splice(1,1,"YY");        // a menjadi ["x","YY","z"]

5) Gimana Cara Menyalin Array Dengan Aman (bukan Sekadar Referensi)?

Jawaban: Untuk salinan dangkal gunakan spread, slice(), atau Array.from(). Untuk struktur bersarang, pertimbangkan structuredClone() atau teknik rekursif—karena salinan dangkal tidak menggandakan objek di dalamnya.

const arr = [{n:1},{n:2}];
const shallow = [...arr];           // salinan dangkal
shallow[0].n = 99;                  // arr[0].n ikut berubah!
const deep = structuredClone(arr);  // salinan dalam (browser modern)

6) Bagaimana Cara Mengelompokkan (grouping) Array Of Objects?

Jawaban: Gunakan reduce() untuk membangun objek indeks kelompok.

const produk = [
  {id:1, kategori:"buah", nama:"apel"},
  {id:2, kategori:"sayur", nama:"wortel"},
  {id:3, kategori:"buah", nama:"mangga"},
];

const byKategori = produk.reduce((acc, item) => {
  (acc[item.kategori] ||= []).push(item.nama);
  return acc;
}, {});
// { buah:["apel","mangga"], sayur:["wortel"] }

Tip cepat: untuk UI/framework reaktif, prioritaskan metode non-mutating seperti map, filter, slice, concat, toSorted, toSpliced agar update state lebih aman dan prediktabel.

Kesimpulan

Array dalam JavaScript adalah alat serbaguna untuk menyimpan dan memproses data. Kalian bisa membuatnya dengan literal atau konstruktor, memakai metode deklaratif seperti map, filter, reduce, serta memahami perilaku slice dan splice untuk mengelola perubahan. Sekian artikel dari analiswinter.com, semoga membantu dan sampai jumpa di topik berikutnya!

About the Author

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.