Array Mendalam: Deklarasi dan Mengakses Index

Dalam pengembangan web, Anda jarang sekali hanya berurusan dengan satu buah data. Bayangkan Anda sedang membangun sebuah toko online; Anda tidak hanya menyimpan satu nama produk, melainkan ratusan. Membuat ratusan variabel terpisah (produk1, produk2, produk3) tentu sangat tidak efisien. Di sinilah Array hadir sebagai penyelamat.

Array adalah sebuah struktur data khusus yang memungkinkan Anda menyimpan banyak nilai (elemen) ke dalam satu variabel tunggal.

1. Cara Mendeklarasikan Array

Dalam JavaScript, ada dua cara utama untuk membuat sebuah array, namun cara pertama adalah standar industri yang paling sering digunakan karena lebih bersih dan cepat.

• Cara 1: Array Literal (Sangat Direkomendasikan)

  Menggunakan tanda kurung siku []. Anda bisa langsung memasukkan nilai di dalamnya, dipisahkan dengan koma.

  JavaScript

  const daftarBuah = ["Apel", "Mangga", "Pisang"];
  const angkaAcak = [10, 25, 50, 75];
  const dataCampuran = ["Teks", 100, true, null]; // Boleh dicampur!
  

• Cara 2: Array Constructor (Jarang Digunakan)

  Menggunakan kata kunci new Array().

  JavaScript

  const namaKaryawan = new Array("Budi", "Andi", "Siti");
  

2. Konsep Indexing: Menghitung Mulai dari Nol

Ini adalah aturan emas yang sering membuat pemula kebingungan: Komputer mulai menghitung dari angka 0, bukan 1. Aturan ini dikenal sebagai Zero-Based Indexing.

Jika Anda memiliki array berisi 3 elemen:

• Elemen pertama berada di posisi (Index) 0.

• Elemen kedua berada di posisi (Index) 1.

• Elemen ketiga berada di posisi (Index) 2.

3. Mengakses dan Mengubah Data di dalam Array

Untuk melihat atau mengubah data tertentu di dalam array, Anda harus memanggil nama array tersebut dan menempelkan nomor index-nya di dalam kurung siku [index].

• Mengakses (Membaca) Data:

  JavaScript

  const daftarMobil = ["Honda", "Toyota", "Suzuki"];
  console.log(daftarMobil[0]); // Output: "Honda"
  console.log(daftarMobil[2]); // Output: "Suzuki"
  

• Mengubah (Menimpa) Data:

  Meskipun array dideklarasikan menggunakan const, Anda tetap bisa mengubah nilai di dalam elemennya (mutasi).

  JavaScript

  daftarMobil[1] = "Mitsubishi"; // Mengubah "Toyota" menjadi "Mitsubishi"
  console.log(daftarMobil); // Output: ["Honda", "Mitsubishi", "Suzuki"]
  

Tutorial: Implementasi Manajemen Data Sederhana

Mari kita simulasikan bagaimana array digunakan untuk menyimpan daftar tugas (to-do list) dan bagaimana kita mengakses bagian tertentu dari daftar tersebut:

// 1. Mendeklarasikan Array
const daftarTugas = [ "Membuat kerangka HTML", // Index 0 "Menambahkan desain CSS", // Index 1 "Menulis logika JavaScript", // Index 2 "Mengunggah ke server" // Index 3
]; // 2. Mengakses elemen spesifik
console.log("Tugas pertama saya adalah: " + daftarTugas[0]); // 3. Mengubah elemen karena ada revisi
daftarTugas[1] = "Menambahkan framework Tailwind CSS";
console.log("Update tugas kedua: " + daftarTugas[1]); // 4. Mengetahui total data di dalam Array
// Properti .length menghitung jumlah data dari 1 (bukan dari 0)
console.log("Total tugas yang harus diselesaikan: " + daftarTugas.length);

Tabel Ringkasan Array Dasar

Kesimpulan

Array adalah pondasi untuk membangun fitur-fitur kompleks seperti keranjang belanja, daftar teman, hingga feed media sosial. Selalu ingat bahwa urutan array dimulai dari 0, dan Anda bisa menggunakan properti .length untuk mengetahui berapa banyak barang yang tersimpan di dalam "kotak" array Anda.