JS中的…運算符有什么作用？怎么用？

JavaScript 中的 … 運算符主要有三個用途：1. 展開數組或對象元素，用于函數參數傳遞或合并數組/對象；2. 在函數參數中收集剩余參數，形成數組處理任意數量輸入；3. 在解構賦值中收集剩余部分，便于提取或排除特定數據。例如用 […arr1, …arr2] 合并數組，用 function sum(…numbers) 處理變參，以及通過 [first, …rest] 解構獲取剩余元素。

在 JavaScript 中，… 運算符是一個非常實用的語法，主要用在數組和對象的操作中。它看起來簡單，但用途廣泛，能讓你寫出更簡潔、易讀的代碼。

展開數組或對象的內容

… 最常見的一個作用是“展開”數組或對象中的元素。比如你想把一個數組里的所有元素作為參數傳給一個函數，或者合并多個數組時，就可以用它。

舉個例子：

const arr = [1, 2, 3]; console.log(...arr); // 輸出：1 2 3

上面這行代碼等價于把數組中的每個元素單獨傳給 console.log。這種寫法在合并數組時特別方便：

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

對對象也是一樣，比如合并兩個對象：

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

收集函數參數

除了展開，… 還可以用在函數參數中，用來收集“剩余”的參數，也就是我們常說的“rest 參數”。

比如這個例子：

function sum(...numbers) {   return numbers.reduce((total, num) => total + num, 0); }  sum(1, 2, 3); // 6

這里的 …numbers 把傳進來的所有參數都收集成一個數組，這樣你就可以處理任意數量的參數了。

需要注意的是，在函數定義里，… 只能出現在最后一個參數上，否則會報錯。

在解構賦值中使用

… 還可以配合數組或對象的解構使用，把剩下的內容收集起來。

比如從數組中提取前幾個元素，剩下的放在一起：

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

對象也一樣：

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

這種寫法在處理數據時非常有用，尤其是你需要去掉某些字段或者提取部分數據的時候。

基本上就這些常見用法了。… 看起來只是一個符號，但理解清楚它在不同上下文中的行為，會讓你寫 JS 更加得心應手。