Mengenal Spread operator pada Javascript

Spread operator berguna untuk memperluas elemen-elemen dari suatu array atau object.

Bagaimana cara kerjanya?

1. Spread Operator pada array

const buah1 = ['apel', 'pisang'];
const buah2 = ['mangga', 'jeruk'];

const semuaBuah = [...buah1, ...buah2];

console.log(semuaBuah); // Output: ['apel', 'pisang', 'mangga', 'jeruk']

1. Spread Operator pada Objek

const buah1 = { apel: 5, pisang: 3 };
const buah2 = { mangga: 4, jeruk: 2 };

const semuaBuah = { ...buah1, ...buah2 };

console.log(semuaBuah); // Output: { apel: 5, pisang: 3, mangga: 4, jeruk: 2 }

1. Spread Operator untuk Menyalin Array atau Objek

const buahAsli = ['apel', 'pisang'];
const buahSalinan = [...buahAsli];

console.log(buahSalinan); // Output: ['apel', 'pisang']

const buahAsliObj = { apel: 5, pisang: 3 };
const buahSalinanObj = { ...buahAsliObj };

console.log(buahSalinanObj); // Output: { apel: 5, pisang: 3 }

1. Spread Operator dalam Fungsi

Spread operator juga dapat digunakan untuk mengirimkan elemen-elemen array sebagai argumen ke dalam fungsi.

function tampilkanBuah(buah1, buah2, buah3) {
  console.log(`Saya suka ${buah1}, ${buah2}, dan ${buah3}`);
}

const buah = ['apel', 'pisang', 'mangga'];

tampilkanBuah(...buah); // Output: Saya suka apel, pisang, dan mangga

1. Spread Operator untuk Menggabungkan dan Mengganti Properti

const buah1 = { apel: 5, pisang: 3 };
const buah2 = { mangga: 4, jeruk: 2, apel: 10 }; // Mengganti jumlah apel

const semuaBuah = { ...buah1, ...buah2 };

console.log(semuaBuah); // Output: { apel: 10, pisang: 3, mangga: 4, jeruk: 2 }