Menguasai Operator Spread dan Rest dalam JavaScript

Penyebaran dan Rehat Operator dalam JavaScript

Pengendali spread dan rehat, kedua-duanya diwakili oleh tiga titik (...), adalah ciri serba boleh dalam JavaScript yang diperkenalkan dalam ES6. Walaupun mereka berkongsi sintaks yang sama, ia mempunyai tujuan yang berbeza: pengendali penyebaran digunakan untuk mengembangkan elemen, manakala operator rehat digunakan untuk mengumpul elemen.

1. Operator Spread

Pengendali hamparan digunakan untuk mengembangkan elemen tatasusunan, objek atau boleh lelar ke dalam elemen individu.

A. Tersebar dalam Tatasusunan

Pengendali hamparan boleh digunakan untuk menyalin, menggabungkan atau menghantar elemen tatasusunan.

Contoh: Menyalin Tatasusunan

const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // Creates a copy of arr1
console.log(arr2); // Output: [1, 2, 3]

Contoh: Susunan Menggabungkan

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2];
console.log(combined); // Output: [1, 2, 3, 4, 5, 6]

Contoh: Menghantar Elemen kepada Fungsi

const numbers = [10, 20, 30];
console.log(Math.max(...numbers)); // Output: 30

B. Merebak dalam Objek

Anda boleh menggunakan operator hamparan untuk menyalin atau menggabungkan objek.

Contoh: Menyalin Objek

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

Contoh: Menggabungkan Objek

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = { ...obj1, ...obj2 };
console.log(merged); // Output: { a: 1, b: 3, c: 4 }

2. Operator Rehat

Pengendali selebihnya mengumpul berbilang elemen ke dalam tatasusunan atau objek tunggal. Ia biasanya digunakan dalam parameter fungsi atau tugasan memusnahkan.

A. Menggunakan Rehat dalam Parameter Fungsi

Pengendali selebihnya boleh mengumpulkan bilangan argumen yang tidak ditentukan ke dalam tatasusunan.

Contoh: Mengumpul Hujah

function sum(...numbers) {
  return numbers.reduce((total, num) => total + num, 0);
}
console.log(sum(1, 2, 3, 4)); // Output: 10

B. Menggunakan Rehat dalam Tatasusunan Memusnahkan

Pengendali selebihnya mengumpul elemen yang tinggal dalam operasi pemusnahan tatasusunan.

Contoh: Pemusnahan Tatasusunan

const [first, second, ...rest] = [1, 2, 3, 4, 5];
console.log(first); // Output: 1
console.log(second); // Output: 2
console.log(rest); // Output: [3, 4, 5]

C. Menggunakan Rehat dalam Memusnahkan Objek

Pengendali selebihnya mengumpul sifat yang tinggal dalam operasi memusnahkan objek.

Contoh: Pemusnahan Objek

const arr1 = [1, 2, 3];
const arr2 = [...arr1]; // Creates a copy of arr1
console.log(arr2); // Output: [1, 2, 3]

3. Perbezaan Utama Antara Operator Spread dan Rest

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const combined = [...arr1, ...arr2];
console.log(combined); // Output: [1, 2, 3, 4, 5, 6]

const numbers = [10, 20, 30];
console.log(Math.max(...numbers)); // Output: 30

Atas ialah kandungan terperinci Menguasai Operator Spread dan Rest dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!