前言

Spread Operator(展開運算符)是 ES6 引入的強大功能,使用三個點 ... 來表示。它可以展開陣列或物件,讓程式碼更簡潔易讀。

Spread Operator 是什麼?

在 JavaScript 中,Spread operator 是一個用來展開 arrayobject 的運算符號,可以分解成單獨的元素,讓它們可以被傳遞到函式或者陣列中。好處是可以簡化程式碼,使其簡潔易讀。

陣列的應用

展開陣列

const arr1 = [1, 2, 3];
const arr2 = [...arr1, 4, 5, 6];

console.log(arr2); // [1, 2, 3, 4, 5, 6]

將兩個陣列合併

const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const arr3 = [...arr1, ...arr2];

console.log(arr3); // [1, 2, 3, 4, 5, 6]

在函式中傳遞陣列

function myFunction(x, y, z) {
  console.log(x + y + z);
}

const arr = [1, 2, 3];

myFunction(...arr); // 6

複製陣列

const arr1 = [1, 2, 3];
const arr2 = [...arr1];

console.log(arr2); // [1, 2, 3]

物件的應用

展開物件

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, c: 3 };

console.log(obj2); // { a: 1, b: 2, c: 3 }

將原物件屬性取代為新值

const obj1 = { a: 1, b: 2 };
const obj2 = { ...obj1, a: 3 };

console.log(obj2); // { a: 3, b: 2 }

總結

Spread Operator 是 JavaScript 中非常實用的語法,無論是複製陣列、合併陣列、還是操作物件,都能讓程式碼更加簡潔。建議在日常開發中多加利用這個強大的功能。