Saat mulai belajar JavaScript, ada beberapa konsep dasar yang hampir pasti akan ditemui. Dua di antaranya adalah Array dan Object. Keduanya digunakan untuk menyimpan dan mengelola data, tetapi memiliki cara kerja yang berbeda.
Bagi pemula, Array dan Object terkadang terlihat membingungkan karena sama-sama dapat menyimpan banyak informasi. Padahal, jika memahami konsep dasarnya, keduanya justru akan sangat membantu ketika membuat program JavaScript.
Lalu, apa itu Array dan Object? Apa perbedaannya? Dan kapan sebaiknya menggunakan masing-masing? Mari kita pelajari dengan contoh sederhana.
Apa Itu Array dalam JavaScript?
Array JavaScript adalah struktur data yang digunakan untuk menyimpan beberapa nilai dalam satu variabel.
Sebagai contoh, jika ingin menyimpan daftar nama buah, kita dapat membuat Array seperti berikut:
let buah = ["Apel", "Jeruk", "Mangga", "Pisang"];
Variabel buah sekarang memiliki empat data.
Daripada membuat beberapa variabel seperti:
let buah1 = "Apel";
let buah2 = "Jeruk";
let buah3 = "Mangga";
let buah4 = "Pisang";
lebih praktis menggunakan satu Array.
Cara Mengakses Data Array
Setiap data dalam Array memiliki posisi yang disebut index. Hal yang perlu diingat adalah index Array dimulai dari 0.
Contohnya:
let buah = ["Apel", "Jeruk", "Mangga"];
console.log(buah[0]);
Hasilnya:
Apel
Sedangkan:
console.log(buah[2]);
akan menghasilkan:
Mangga
Jadi urutannya adalah:
| Index | Data |
|---|---|
| 0 | Apel |
| 1 | Jeruk |
| 2 | Mangga |
Konsep index ini sangat penting karena akan sering digunakan ketika mengolah data Array.
Menambahkan Data ke Array
JavaScript menyediakan beberapa method yang dapat digunakan untuk mengelola Array.
Salah satunya adalah push().
let buah = ["Apel", "Jeruk"];
buah.push("Mangga");
console.log(buah);
Hasilnya:
["Apel", "Jeruk", "Mangga"]
Method push() digunakan untuk menambahkan data ke bagian akhir Array.
Menghapus Data dari Array
Untuk menghapus data terakhir dari Array, kita dapat menggunakan pop().
let buah = ["Apel", "Jeruk", "Mangga"];
buah.pop();
console.log(buah);
Hasilnya:
["Apel", "Jeruk"]
Selain push() dan pop(), masih banyak method Array yang nantinya dapat dipelajari, seperti map(), filter(), find(), dan forEach().
Apa Itu Object dalam JavaScript?
Jika Array cocok untuk menyimpan kumpulan data, Object JavaScript biasanya digunakan untuk menyimpan data yang memiliki hubungan atau karakteristik tertentu.
Contohnya, kita ingin menyimpan informasi seorang siswa:
let siswa = {
nama: "Rina",
kelas: "11 RPL",
jurusan: "Rekayasa Perangkat Lunak"
};
Object tersebut memiliki beberapa property, yaitu:
namakelasjurusan
Masing-masing property memiliki nilai.
Dengan Object, informasi yang saling berhubungan dapat disimpan dalam satu tempat.
Cara Mengakses Data Object
Ada dua cara umum untuk mengakses property Object.
Menggunakan Dot Notation
console.log(siswa.nama);
Hasil:
Rina
Contoh lainnya:
console.log(siswa.jurusan);
Hasil:
Rekayasa Perangkat Lunak
Menggunakan Bracket Notation
Kita juga dapat menggunakan tanda kurung siku:
console.log(siswa["nama"]);
Hasilnya tetap:
Rina
Cara ini berguna ketika nama property disimpan dalam sebuah variabel.
Mengubah Data Object
Property dalam Object dapat diubah setelah Object dibuat.
Contohnya:
let siswa = {
nama: "Rina",
kelas: "11 RPL"
};
siswa.kelas = "12 RPL";
console.log(siswa.kelas);
Hasil:
12 RPL
Artinya, nilai kelas yang sebelumnya 11 RPL telah berubah menjadi 12 RPL.
Menambahkan Property Baru
Kita juga dapat menambahkan property baru ke dalam Object.
let siswa = {
nama: "Rina",
kelas: "11 RPL"
};
siswa.sekolah = "SMK Teknologi";
Sekarang Object tersebut memiliki tiga property:
{
nama: "Rina",
kelas: "11 RPL",
sekolah: "SMK Teknologi"
}
Fleksibilitas seperti ini membuat Object sangat berguna dalam pengembangan aplikasi.
Apa Perbedaan Array dan Object?
Meskipun sama-sama digunakan untuk menyimpan data, Array dan Object memiliki tujuan yang berbeda.
| Array | Object |
|---|---|
| Cocok untuk kumpulan data | Cocok untuk data dengan atribut |
| Menggunakan index | Menggunakan property/key |
| Index dimulai dari 0 | Property memiliki nama |
| Contoh: daftar produk | Contoh: informasi satu produk |
Contoh Array:
let warna = ["Merah", "Biru", "Hijau"];
Contoh Object:
let produk = {
nama: "Laptop",
harga: 5000000,
stok: 10
};
Dari contoh tersebut terlihat bahwa Array lebih cocok ketika kita memiliki daftar, sedangkan Object lebih cocok untuk menggambarkan satu entitas dengan beberapa informasi.
Array dan Object Bisa Digabungkan
Menariknya, Array dan Object tidak harus digunakan secara terpisah.
Keduanya justru sering digunakan bersama dalam aplikasi JavaScript.
Misalnya kita memiliki daftar produk:
let produk = [
{
nama: "Laptop",
harga: 5000000
},
{
nama: "Mouse",
harga: 150000
},
{
nama: "Keyboard",
harga: 300000
}
];
Pada contoh tersebut:
- Array digunakan untuk menyimpan daftar produk.
- Object digunakan untuk menyimpan informasi setiap produk.
Struktur seperti ini sangat umum ditemukan dalam aplikasi web.
Misalnya ketika website menerima data produk dari database melalui API, data tersebut sering kali diproses menggunakan kombinasi Array dan Object.
Kapan Sebaiknya Menggunakan Array?
Gunakan Array ketika ingin menyimpan sekumpulan data yang memiliki jenis atau tujuan yang sama.
Contohnya:
let namaSiswa = ["Andi", "Budi", "Citra"];
Contoh penggunaan lainnya:
- Daftar produk
- Daftar siswa
- Daftar kategori
- Daftar komentar
- Daftar nilai
Jika datanya berupa kumpulan item, Array biasanya menjadi pilihan yang tepat.
Kapan Sebaiknya Menggunakan Object?
Gunakan Object ketika ingin menyimpan informasi yang memiliki atribut tertentu.
Contohnya:
let laptop = {
merk: "Lenovo",
ram: "8GB",
penyimpanan: "512GB"
};
Object cocok digunakan untuk menyimpan:
- Data pengguna
- Informasi produk
- Data pelanggan
- Data siswa
- Informasi transaksi
Dengan Object, setiap data dapat memiliki nama property yang jelas sehingga lebih mudah dibaca.
Tips Belajar Array dan Object untuk Pemula
Jika Anda baru belajar JavaScript, tidak perlu langsung mempelajari semua method dan konsep yang kompleks.
Mulailah dari beberapa hal berikut:
1. Pahami Cara Menyimpan Data
Cobalah membuat Array dan Object sederhana.
2. Latihan Mengakses Data
Biasakan menggunakan index pada Array dan property pada Object.
3. Coba Mengubah Data
Latih diri untuk menambahkan, mengubah, dan menghapus data.
4. Buat Project Sederhana
Misalnya membuat daftar:
- Produk
- Siswa
- Buku
- Film
- Tugas
Dengan project sederhana, konsep Array dan Object akan lebih mudah dipahami.
5. Jangan Hanya Menghafal
Yang paling penting bukan menghafal semua method, tetapi memahami kapan dan mengapa sebuah method digunakan.
Kesimpulan
Array dan Object JavaScript merupakan dua konsep dasar yang sangat penting untuk dipahami oleh pemula. Array digunakan untuk menyimpan kumpulan data, sedangkan Object digunakan untuk menyimpan data yang memiliki atribut atau property tertentu.
Keduanya bahkan sering digunakan secara bersamaan dalam aplikasi web modern. Karena itu, memahami Array dan Object akan menjadi bekal penting sebelum mempelajari konsep JavaScript yang lebih lanjut.
Tidak perlu terburu-buru menguasai semuanya. Mulailah dari contoh sederhana, lakukan banyak praktik, dan perlahan tingkatkan tingkat kesulitannya. Semakin sering digunakan, semakin mudah Anda memahami cara kerja Array dan Object dalam JavaScript.


