扩展操作符允许可迭代对象在预期参数为0+的位置展开。它主要用于需要多于1个值的变量数组中。它允许我们从数组中获取参数列表。扩展操作符的语法与Rest参数相同，但其工作原理完全相反。
语法如下：
var variablename1 = [...value];在上面的语法中，…是扩展操作符，它将针对特定变量中的所有值。当发生在函数调用或类似的情况时，称为扩展运算符。在很多情况下都可以使用扩展操作符，比如我们想对math对象进行扩展、复制、连接时。让我们逐一来看一下:
注意：为了运行本文中的代码, 请使用浏览器提供的控制台。
Concat()
javascript提供的concat()方法有助于连接两个或多个字符串(String concat())，或用于合并两个或多个数组。对于数组，此方法不会更改现有数组，而是返回一个新数组。
// normal array concat() method
let arr = [1, 2, 3];
let arr2 = [4, 5];
arr = arr.concat(arr2);
console.log(arr); // [ 1, 2, 3, 4, 5 ]输出如下：
我们可以在spread操作符的帮助下实现相同的输出，代码如下所示:
// spread operator doing the concat job
let arr = [1, 2, 3];
let arr2 = [4, 5];
arr = [...arr, ...arr2];
console.log(arr); // [ 1, 2, 3, 4, 5 ]输出如下：
注意:虽然我们可以达到相同的结果，但不建议在这种特殊情况下使用spread，因为对于大型数据集，它的工作速度会比本地的concat()方法慢。
复制(类似拼接方法)
为了将数组的内容复制到另一个数组, 我们可以执行以下操作：
// copying without the spread operator
let arr = [ 'a' , 'b' , 'c' ];
let arr2 = arr;
console.log(arr2); // [ 'a', 'b', 'c' ]输出如下：
面的代码运行良好，因为我们可以将一个数组的内容复制到另一个数组，但实际上，它是非常不同的，因为当我们改变新数组时，它也会影响旧数组(我们复制的那个数组)。参见下面的代码:
// changed the original array
let arr = [ 'a' , 'b' , 'c' ];
let arr2 = arr;
arr2.push( 'd' );
console.log(arr2);
console.log(arr); // even affected the original array(arr)输出如下：
在上面的代码中，我们可以清楚地看到，当我们试图在数组中插入一个元素时，原始数组也会发生改变，这不是我们想要的，也不推荐这样做。在这种情况下，我们可以像这样使用spread操作符:
// spread operator for copying
let arr = [ 'a' , 'b' , 'c' ];
let arr2 = [...arr];
console.log(arr); // [ 'a', 'b', 'c' ]
arr2.push( 'd' ); //inserting an element at the end of arr2
console.log(arr2); // [ 'a', 'b', 'c', 'd' ]
console.log(arr); // [ 'a', 'b', 'c' ]输出如下：
通过使用spread操作符，我们可以确保在更改新数组时，原始数组不会受到影响。
扩展
当我们想要将一个数组展开为另一个数组时，我们可以这样做:
// normally used expand method
let arr = [ 'a' , 'b' ];
let arr2 = [arr, 'c' , 'd' ];
console.log(arr2); // [ [ 'a', 'b' ], 'c', 'd' ]输出如下：
尽管我们在一个数组中获取另一个数组中的内容，但实际上它是另一个数组中的数组这显然是我们不想要的。如果我们希望内容在单个数组中，我们可以使用spread操作符。
// expand using spread operator
let arr = [ 'a' , 'b' ];
let arr2 = [...arr, 'c' , 'd' ];
console.log(arr2); // [ 'a', 'b', 'c', 'd' ]输出如下：
Math
javascript中的Math对象具有不同的属性，我们可以利用这些属性来做我们想做的事情，比如从数字列表中找到最小值，找到最大值等。考虑这样一种情况，我们想要从一列数字中找到最小值，我们将这样写:
console.log(Math.min(1, 2, 3, -1)); //-1输出如下：
现在考虑我们有一个数组而不是一个列表，上面的数学对象方法将不起作用，将返回NaN，如下所示:
// min in an array using Math.min()
let arr = [1, 2, 3, -1];
console.log(Math.min(arr)); //NaN输出如下：
当在函数调用中使用…arr时，它将可迭代对象arr“展开”为参数列表
为了避免这种NaN输出，我们使用了spread操作符，如下所示:
// with spread
let arr = [1, 2, 3, -1];
console.log(Math.min(...arr)); //-1输出如下：
对象扩展操作符的示例
ES6在javascript中为对象字面量添加了spread属性。带有对象的spread操作符(…)用于创建具有新值或更新值的现有对象副本，或者创建具有更多属性的对象副本。让我们举一个如何在对象上使用spread操作符的例子，
const user1 = {
name: 'Jen' , age: 22
};
const clonedUser = { ...user1 };
console.log(clonedUser);输出如下：
这里我们正在传播user1对象。user1对象的所有键值对都被复制到clonedUser对象中。让我们看一下使用spread操作符合并两个对象的另一个例子，
const user1 = {
name: 'Jen' , age: 22, };
const user2 = {
name: "Andrew" , location: "Philadelphia"
};
const mergedUsers = {...user1, ...user2};
console.log(mergedUsers)输出如下：
mergedUsers是的副本用户1和用户2。实际上, 对象上的每个可枚举属性都将被复制到mergedUsers对象。点差运算符只是Object.assign()但是, 它们之间存在一些差异。
更多前端开发相关内容请参考：lsbin - IT开发技术：https://www.lsbin.com/
参考以下JavaScript相关内容：