Cara Menggunakan Array Object JavaScript untuk Pemula
Irhan Hisyam Dwi Nugroho
•
29 August 2025
•
844
Warga Bimbingan tau gak, array object JavaScript itu penting banget buat ngolah data yang kompleks kayak daftar user atau produk? Skill ini wajib banget dikuasai kalau kamu mau serius ngoding.
Di sini, MinDi bakal jelasin cara pakai array object JavaScript dengan langkah-langkah simpel, biar makin luwes pas ngoding beneran. Yuk, mulai!
Apa Itu Array Object di JavaScript?
Array object di JavaScript adalah struktur data berupa array yang setiap elemennya berisi object, bukan angka atau string biasa.
Format ini sering digunakan saat kita ingin menyimpan kumpulan data yang punya banyak properti, seperti daftar pengguna dengan nama, umur, dan email.
Dibanding array biasa, array object jauh lebih fleksibel dan cocok banget buat ngolah data dari API atau database.
Karena itu, memahami cara kerja array object jadi salah satu kunci penting buat kamu yang ingin naik level dalam dunia JavaScript.
Baca juga: Panduan Memilih Bootcamp Full Stack Developer yang Tepat
Panduan Lengkap Array Object JavaScript
Sumber: Canva
Kalau kamu udah sering ngolah data di JavaScript, pasti bakal sering ketemu yang namanya array of objects.
Nah, bagian ini MinDi dedikasikan buat kamu yang pengen paham cara bikin, akses, ubah, sampai cari data di dalam array object. Yuk langsung kita bedah bareng-bareng!
1. Cara Membuat Array Object di JavaScript
Array object adalah array yang setiap elemennya berupa object. Biasanya digunakan untuk menyimpan kumpulan data seperti daftar user, produk, atau catatan.
Struktur ini sangat umum dalam pengolahan data modern, apalagi saat terhubung ke API.
Contoh Kode:
const users = [ { name: "Ana", age: 25 }, { name: "Budi", age: 30 } ]; console.log(users[0]); |
Output:
{ name: "Ana", age: 25 } |
2. Cara Mengakses Data dalam Array Object
Untuk mengakses data di dalam array object, kamu cukup gunakan indeks array diikuti dengan nama properti.
Ini seperti membuka laci (pakai angka) lalu ambil isinya (pakai label). Cocok banget buat menampilkan informasi tertentu secara spesifik.
Contoh Kode:
console.log(users[1].name); |
Output:
Budi |
Baca juga: Ingin Belajar Front End Development? Cek Roadmapnya di sini!
3. Cara Menambahkan Object ke dalam Array
Kalau kamu ingin menambahkan data baru ke dalam array, gunakan metode .push(). Ini akan menambahkan object ke akhir array tanpa mengubah data yang sudah ada. Sangat berguna kalau kamu lagi bikin fitur “tambah data”.
Contoh Kode:
users.push({ name: "Cici", age: 22 }); console.log(users); |
Output:
[ { name: "Ana", age: 25 }, { name: "Budi", age: 30 }, { name: "Cici", age: 22 } ] |
Baca juga: 12 Bahasa Pemrograman Front End Teratas & Terpopuler 2024
4. Cara Mengedit Object dalam Array
Untuk mengubah data, cukup akses object-nya lewat indeks lalu ubah propertinya secara langsung.
Teknik ini sering dipakai saat pengguna meng-update profil, misalnya ubah umur atau nama. Pastikan kamu tahu di indeks berapa data itu berada.
Contoh Kode:
users[0].age = 26; console.log(users[0]); |
Output:
{ name: "Ana", age: 26 } |
Baca juga: 10 Text Editor Terbaik untuk Web Developer (2025)
5. Cara Menghapus Object dari Array
Untuk menghapus object dari array, gunakan metode .splice(). Kamu perlu tahu indeks object yang ingin dihapus, lalu tentukan berapa banyak yang mau dihapus. Cara ini cocok buat fitur “hapus data” di aplikasi.
Contoh Kode:
users.splice(1, 1); // Hapus 1 item dari index ke-1 console.log(users); |
Output:
[ { name: "Ana", age: 26 }, { name: "Cici", age: 22 } ] |
Baca juga: Cara Menjadi Web Developer Freelance: Panduan Pemula
6. Cara Mencari Data dalam Array Object
Metode .find() berguna untuk mencari satu object berdasarkan kriteria tertentu, sedangkan .filter() bisa mengembalikan banyak hasil.
Fitur ini sering banget dipakai buat nyari data user, produk, atau kategori tertentu. Jadi pastikan kamu paham perbedaan keduanya.
Contoh Kode:
const result = users.find(user => user.name === "Cici"); console.log(result); |
Output:
{ name: "Cici", age: 22 } |
Ingin Jadi Full Stack Web Developer Profesional?
Setelah belajar cara menggunakan array object JavaScript untuk pemula, sekarang saatnya kamu bawa skill-mu ke level berikutnya dan mulai membangun aplikasi web yang utuh dan powerful!
Yuk, ikuti Bootcamp Full Stack Web Developer di dibimbing.id! Di sini, kamu nggak cuma belajar dasar-dasar JavaScript, tapi juga teknologi modern seperti React, Node.js, Express, hingga database dan deployment.
Belajar langsung dari mentor-mentor berpengalaman, plus kurikulum yang aplikatif dan sesuai kebutuhan industri.
MinDi kasih tahu nih, lebih dari 840+ hiring partner udah siap nyambut talenta kayak kamu—dan tingkat keberhasilan alumni kita bahkan tembus 96%!
Jadi, tunggu apa lagi, Warga Bimbingan? Daftar sekarang disini dan mulai langkahmu jadi Full Stack Developer andalan. #BimbingSampeJadi
Referensi
- JavaScript Array of Objects Tutorial [Buka]
Irhan Hisyam Dwi Nugroho
Irhan Hisyam Dwi Nugroho is an SEO Specialist and Content Writer with 4 years of experience in optimizing websites and writing relevant content for various brands and industries. Currently, I also work as a Content Writer at Dibimbing.id and actively share content about technology, SEO, and digital marketing through various platforms.
