## 擴展語法與其餘參數：有什麼區別以及它們如何運作？

理解ES2015 / ES6 中的擴展語法和剩餘參數

ES2015 的引入引入了兩種新語法，擴展語法和剩餘參數，促進JavaScript 中靈活的資料處理。雖然兩者表面上類似於省略號運算符，但它們具有不同的用途。

擴展語法

擴展語法，由三個點 (...var) 表示，擴展了一個可迭代 (例如數組）分解為各個元素。主要用於三種場景：

• 組合陣列：將多個數字組合並為一個陣列：

  <code class="js">var abc = ['a', 'b', 'c'];
  var def = ['d', 'e', 'f'];
  var alpha = [ ...abc, ...def ];
  console.log(alpha); // alpha == ['a', 'b', 'c', 'd', 'e', 'f']</code>

• 將參數傳遞給函數：將參數陣列傳播到函數參數上：

  <code class="js">function sum(...args) {
  return args.reduce((total, val) => total + val, 0);
  }
  const values = [1, 2, 3, 4];
  console.log(sum(...values)); // 10</code>

• 建立淺物件副本：擴充物件鍵插入新物件：

  <code class="js">const person1 = { name: 'John', age: 30 };
  const person2 = { ...person1, city: 'New York' };</code>

剩餘參數

與擴充語法不同，剩餘參數僅在函數定義中使用。它們由三個點和一個變數名 (...var) 表示。其餘參數將不定數量的參數收集到陣列中。

<code class="js">function logRest(...args) {
  console.log(args); // args == [ 'a', 'b', 'c', 'd', 'e' ]
}
logRest('a', 'b', 'c', 'd', 'e');</code>

主要差異

• 用法：擴充語法擴充數組，而其餘參數則收集參數。
• 上下文：擴充語法用於表達式中，而其餘參數用於函數定義中。
• 輸出 ：擴充語法產生單一元素，而剩餘參數產生陣列。

結論

擴展語法和剩餘參數增強了JavaScript 的數據操作能力，提供了便捷的方法創建新數組、傳播參數以及收集函數中的參數。了解它們的不同用途使開發人員能夠有效地利用這些語法來提高程式碼靈活性和簡潔性。

以上是## 擴展語法與其餘參數：有什麼區別以及它們如何運作？的詳細內容。更多資訊請關注PHP中文網其他相關文章！