Add Property To Object Javascript Using Spread

MUAZHAN

2 min read

·

Jun 22, 2024

46

Share

Menambahkan Property ke Objek JavaScript Menggunakan Spread Syntax

Spread syntax (...) dalam JavaScript memungkinkan kita untuk dengan mudah menambahkan property baru ke objek yang sudah ada. Berikut cara kerjanya:

Dasar Penggunaan Spread Syntax

Ketika menggunakan spread syntax pada objek, kita "menyebarkan" semua property dari objek sumber ke objek target.

const originalObject = {
  name: "John",
  age: 30,
};

const updatedObject = {
  ...originalObject,
  city: "New York",
};

console.log(updatedObject); 
// Output: { name: "John", age: 30, city: "New York" }

Penjelasan:

• originalObject adalah objek sumber yang property-nya akan di-spread.
• ...originalObject memisahkan semua property dari originalObject dan menambahkannya ke dalam objek target.
• updatedObject adalah objek target yang akan menerima property dari originalObject dan juga memiliki property baru, city.

Manfaat Spread Syntax

1. Mempermudah Penambahan Property: Spread syntax menawarkan cara yang lebih ringkas untuk menambahkan property baru ke objek dibandingkan dengan menggunakan Object.assign().

2. Mencegah Modifikasi Objek Asli: Spread syntax membuat salinan baru dari objek sumber, sehingga tidak akan mengubah objek asli.

3. Fleksibelitas: Spread syntax memungkinkan kita untuk menambahkan property dari beberapa objek sekaligus:

const object1 = { a: 1, b: 2 };
const object2 = { c: 3, d: 4 };

const combinedObject = { ...object1, ...object2 };
console.log(combinedObject); 
// Output: { a: 1, b: 2, c: 3, d: 4 }

Kesimpulan

Spread syntax adalah alat yang sangat berguna untuk menambahkan property ke objek JavaScript. Ini menyediakan cara yang sederhana, fleksibel, dan efisien untuk membuat objek baru dengan menggabungkan property dari objek yang sudah ada.