Cara Menambahkan Pasangan Kunci-Nilai Baru ke Array Objek di JavaScript
Dalam pengembangan web dengan JavaScript, Anda seringkali perlu memanipulasi data dalam bentuk array objek. Salah satu manipulasi yang umum dilakukan adalah menambahkan pasangan kunci-nilai baru ke objek yang ada dalam array. Artikel ini akan membahas berbagai metode yang dapat Anda gunakan untuk melakukan hal tersebut.
1. Menambahkan Kunci-Nilai Baru ke Objek yang Sudah Ada
Metode ini cocok digunakan jika Anda ingin menambahkan pasangan kunci-nilai baru ke semua objek dalam array.
const data = [
{ name: 'John', age: 30 },
{ name: 'Jane', age: 25 }
];
// Menambahkan kunci baru 'city' ke semua objek
data.forEach(obj => {
obj.city = 'New York';
});
console.log(data);
// Output:
// [{ name: 'John', age: 30, city: 'New York' }, { name: 'Jane', age: 25, city: 'New York' }]
Dalam kode di atas, fungsi forEach
digunakan untuk iterasi melalui setiap objek dalam array. Kemudian, sebuah kunci baru bernama city
ditambahkan ke setiap objek dengan nilai New York
.
2. Menambahkan Kunci-Nilai Baru ke Objek Tertentu
Jika Anda hanya ingin menambahkan pasangan kunci-nilai baru ke objek tertentu dalam array, Anda bisa menggunakan index objek tersebut.
const data = [
{ name: 'John', age: 30 },
{ name: 'Jane', age: 25 }
];
// Menambahkan kunci baru 'occupation' ke objek pertama
data[0].occupation = 'Software Engineer';
console.log(data);
// Output:
// [{ name: 'John', age: 30, occupation: 'Software Engineer' }, { name: 'Jane', age: 25 }]
Dalam contoh ini, kita mengakses objek pertama dalam array dengan data[0]
dan kemudian menambahkan kunci baru occupation
dengan nilai Software Engineer
.
3. Menambahkan Kunci-Nilai Baru dengan map()
Jika Anda ingin membuat array baru dengan objek yang memiliki pasangan kunci-nilai tambahan, Anda dapat menggunakan metode map()
.
const data = [
{ name: 'John', age: 30 },
{ name: 'Jane', age: 25 }
];
// Menambahkan kunci baru 'city' dan membuat array baru
const newData = data.map(obj => ({
...obj, // Melakukan spread operator untuk menyalin properti yang sudah ada
city: 'New York'
}));
console.log(newData);
// Output:
// [{ name: 'John', age: 30, city: 'New York' }, { name: 'Jane', age: 25, city: 'New York' }]
Dalam kode ini, map()
digunakan untuk iterasi melalui setiap objek dalam array dan mengembalikan objek baru yang memiliki semua properti lama ditambah dengan properti baru city
.
Kesimpulan
Ada beberapa cara untuk menambahkan pasangan kunci-nilai baru ke array objek di JavaScript. Pilih metode yang sesuai dengan kebutuhan Anda, baik untuk menambahkan ke semua objek, objek tertentu, atau untuk membuat array baru dengan objek yang dimodifikasi.