Destructuring, rest, spread

Bongkar array/objek ke variabel + kumpulkan sisanya.

Pahami konsepnya

Destructuring membongkar koleksi ke variabel dalam satu baris. Array: const [a, b, c] = [1, 2, 3]. Objek: const { nama, umur } = { nama: "Ari", umur: 17 }. Nama variabel HARUS sama dengan nama properti objek — kecuali di-rename: const { nama: n } = obj.

Rest (...): menangkap sisanya ke array/objek. const [pertama, ...sisanya] = [1,2,3,4] memberi pertama=1, sisanya=[2,3,4]. const { nama, ...lain } = obj memberi nama dan sisanya sebagai objek.

Spread (...): memecah koleksi jadi elemen terpisah. [...arr1, ...arr2] menggabung array; { ...obj1, ...obj2 } menggabung objek (yang belakangan menimpa). Spread juga untuk parameter fungsi: Math.max(...angka) memberi max dari seluruh array.

Coba contoh kode

// array destructuring
const [pertama, kedua, ...sisanya] = [1, 2, 3, 4, 5];
console.log(pertama, kedua, sisanya);  // 1 2 [3,4,5]

// object destructuring + rename + default
const { nama, umur: tahun = 0, kota = "Tidak ada" } = { nama: "Ari", umur: 17 };
console.log(nama, tahun, kota);  // Ari 17 "Tidak ada"

// swap
let a = 1, b = 2;
[a, b] = [b, a];
console.log(a, b);  // 2 1

// spread
const arr1 = [1, 2], arr2 = [3, 4];
console.log([...arr1, ...arr2]);  // [1,2,3,4]

const obj1 = { a: 1 }, obj2 = { b: 2 };
console.log({ ...obj1, ...obj2 });  // {a:1, b:2}

console.log(Math.max(...[3, 8, 1, 9]));  // 9

Destructuring objek: nama variabel harus sama dengan properti, KECUALI rename dengan titik dua (umur: tahun). Default value dengan = hanya aktif saat undefined. Spread menggantikan concat dan Object.assign.

Latihan singkat

Uji: destructuring [10,20,30] ke a,b — a+b harus `30`.