一个rest参数将收集各个参数到一个数组，当你在一个函数参数定义使用的点，而传播经营者使用一个点时，扩展的阵列到各个参数function call。
当您想将单个参数收集到数组中时，您可以rest在函数参数定义中使用运算符。
let sum = (...numbers) => {
let result = 0;
numbers.forEach(function(n){
result += n;
});
return result;
};
console.log(sum(1,2,3));
处理arguments嵌套函数内部的对象变得非常棘手，让我们看看下面的情况，我们的内部函数需要访问传递的arguments对象。
如果我们inner function filterNumbers需要访问参数，在variable进一步传递它之前必须将其存储在上面，因为每个函数都有自己的arguments对象，它是一个类似对象的数组。
function sumOnlyNumbers() {
var args = arguments;
var numbers = filterNumbers();
return numbers.reduce((sum, element) => sum + element);
function filterNumbers() {
return Array.prototype.filter.call(args,
element => typeof element === 'number'
);
}
}
sumOnlyNumbers(1, 'Hello', 5, false);
该方法有效，但过于冗长。var args = arguments可以省略并且Array.prototype.filter.call(args)可以转换为args.filter()使用rest参数。
function sumOnlyNumbers(...args) {
var numbers = filterNumbers();
return numbers.reduce((sum, element) => sum + element);
function filterNumbers() {
return args.filter(element => typeof element === 'number');
}
}
sumOnlyNumbers(1, 'Hello', 5, false); // => 6
当您想将数组扩展为单个参数时，您可以在函数调用中使用扩展运算符。
let sum = (a,b,c) => {
return a + b + c;
};
console.log(sum(...[1,2,3]));
在上面的代码中，扩展运算符将“spread”跨越parameters a, b, and c. 的spread操作者也可以扩大的阵列创建的个体元件array文字。
var a = [4, 5, 6];
var b = [1, 2, 3, ...a, 7, 8, 9]
console.log(b);
改进了 ES6 中的函数调用
ES5.apply()在函数对象上提供方法来解决这个问题。不幸的是，这种技术有 3 个问题：
- 有必要手动指示函数调用的上下文
- 不能在构造函数调用中使用
- 更短的解决方案更可取
.apply()第二次指出上下文国家似乎无关紧要，使其更加冗长。
let countries = ['India', 'USA'];
let otherCountries = ['China', 'Japan'];
countries.push.apply(countries, otherCountries);
console.log(countries); // => ['India', 'USA', 'China', 'Japan']
该spread运营商填补了function调用参数从一个值array。让我们使用扩展运算符改进上述示例：
let countries = ['India', 'USA'];
let otherCountries = ['China', 'Japan'];
countries.push(...otherCountries);
console.log(countries); // => ['Moldova', 'Ukraine', 'USA', 'Japan']
Spread运算符从数组配置构造函数调用参数，直接使用.apply().
class Actor {
constructor(name, country) {
this.name = name;
this.country = country;
}
getDescription() {
return `${this.name} leads ${this.country}`;
}
}
var details = ['RajiniKanth the Great', 'India'];
var Alexander = new Actor(...details);
console.log(Alexander.getDescription()); // => 'RajiniKanth the Great leads India'
此外，您可以spread在同一调用中组合多个运算符和常规参数。以下示例从数组中删除现有元素，然后添加其他数组和一个元素：
var numbers = [1, 2];
var evenNumbers = [4, 8];
const zero = 0;
numbers.splice(0, 2, ...evenNumbers, zero);
console.log(numbers); // => [4, 8, 0]
克隆一个数组实例：
var words = ['Hi', 'Hello', 'Good day'];
var otherWords = [...words];
console.log(otherWords); // => ['Hi', 'Hello', 'Good day']
console.log(otherWords === words); // => false
otherWords是 words 数组的克隆版本。请注意，克隆仅发生在数组本身上，而不发生在包含的元素上（即它不是深度克隆）。
参考资料：https : //dmitripavlutin.com/how-three-dots-changed-javascript/