擴展語法與剩餘參數：了解差異

在ES2015 中，擴展語法和剩餘參數這兩個新功能提供了強大的方法操作數組和物件。雖然兩者看起來相似，但它們具有不同的用途，並且各自具有自己獨特的功能。

擴展語法

擴展語法（由三個點“...”表示） ) 允許您將一個可迭代對象（例如數組或對象）展開或擴展為另一個可迭代物件中的各個元素。此功能可讓您輕鬆地將多個陣列或物件合併或組合成一個新的陣列或物件。

例如，讓我們考慮以下代碼：

var abc = ['a', 'b', 'c'];
var def = ['d', 'e', 'f'];
var alpha = [ ...abc, ...def ];
console.log(alpha); // alpha == ['a', 'b', 'c', 'd', 'e', 'f'];

在此片段中， ...abc 和... def spread 語法將abc 和def 陣列擴展為單獨的元素，建立一個包含兩個陣列中所有元素的新alpha 陣列。

Rest Parameter

另一方面，剩餘參數（由三個點“...”表示，前面帶有標識符）將傳遞給函數的任何剩餘參數收集到單一數組。剩餘參數必須是函數參數清單中的最後一個參數。

剩餘參數的實際操作範例如下：

function sumAll(...numbers) {
  let total = 0;
  for (let num of numbers) {
    total  = num;
  }
  return total;
}

let result = sumAll(1, 2, 3, 4, 5);
console.log(result); // result == 15

在此程式碼中，...numbers rest 參數收集傳遞給sumAll 函數的剩餘參數（在本例中為1、2、3 、4 和5）並建立單一數字數組。