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

Aspect	Spread Operator	Rest Operator
Purpose	Expands elements into individual items	Collects items into a single entity
Use Cases	Copying, merging, passing elements	Collecting function arguments, destructuring
Data Types	Arrays, Objects, Iterables	Arrays, Objects

Aspek

---

Spread Operator

Operator Rehat Tujuan

Meluaskan elemen ke dalam item individu Mengumpul item menjadi satu entiti Kes Penggunaan Menyalin, menggabungkan, menghantar elemen Mengumpul hujah fungsi, memusnahkan Jenis Data

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

Tatasusunan, Objek, Iterables Susun atur, Objek

4. Contoh Praktikal

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

---

A. Menukar Elemen Tatasusunan

• B. Menggabungkan Rehat dengan Hamparan
5. Ringkasan

Spread Operator (...): Mengembangkan tatasusunan, objek atau iterable ke dalam elemen individu.

Operator Rehat (...)

: Mengumpul berbilang elemen ke dalam tatasusunan atau objek. Kedua-dua pengendali menjadikan kod JavaScript lebih ringkas dan fleksibel, terutamanya apabila bekerja dengan tatasusunan, objek dan parameter fungsi. Hai, saya Abhay Singh Kathayat! Saya seorang pembangun timbunan penuh dengan kepakaran dalam kedua-dua teknologi hadapan dan belakang. Saya bekerja dengan pelbagai bahasa pengaturcaraan dan rangka kerja untuk membina aplikasi yang cekap, berskala dan mesra pengguna. Jangan ragu untuk menghubungi saya melalui e-mel perniagaan saya: kaashshorts28@gmail.com.

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