[js学习]扩展运算符的用法

一.将数组元素在函数中调用

如果不用扩展语法的话，我们将数组元素传入函数一般是用Function.prototype.apply( )方法

例如

function plus(a,b,c){return a+b+c};
var nums=[1,2,3];
 plus.apply(null,nums)//6

如果用扩展语法写的话，可以写成

function plus(a,b,c){return a+b+c};
var nums=[1,2,3];
plus(...nums)//6

参数列表中的任何参数都可以使用扩展语法，并且可以多次使用。

二、在 new 中应用

当用new调用构造函数，它不可能直接使用数组和  apply （apply做了[[Call]]，而不是一个[[Construct]]）。然而，借助新的扩展语法可以轻松使用：

var dateFields = [1970，0，1]; // 1970年1月1日
var d = new Date（... dateFields）;

要使用新的参数数组而不使用扩展语法，则必须通过部分应用程序间接完成它：

function applyAndNew(constructor, args) {
   function partial () {
      return constructor.apply(this, args);
   };
   if (typeof constructor.prototype === "object") {
      partial.prototype = Object.create(constructor.prototype);
   }
   return partial;
}


function myConstructor () {
   console.log("arguments.length: " + arguments.length);
   console.log(arguments);
   this.prop1="val1";
   this.prop2="val2";
};

var myArguments = ["hi", "how", "are", "you", "mr", null];
var myConstructorWithArguments = applyAndNew(myConstructor, myArguments);

console.log(new myConstructorWithArguments);
// (internal log of myConstructor):           arguments.length: 6
// (internal log of myConstructor):           ["hi", "how", "are", "you", "mr", null]
// (log of "new myConstructorWithArguments"): {prop1: "val1", prop2: "val2"}

三、展开数组字面量

1.更强大的数组字面量

无扩散的语法，使用现有阵列作为它的一个部分创建一个新的数组，数组文本语法不再足够和命令性代码必须使用的组合来代替push，splice，concat等。随着扩展语法此变得更加简洁：

var arr1=["dd","ee"]
var arr2=["aa",...arr1,"bb","cc"]
//["aa","dd","ee","bb","cc"]

就像传播参数列表一样，  ...可以在数组文字中的任何位置使用，并且可以多次使用。

2.复制一个数组

var arr1=["aa",'bb',"cc"]
var arr2=[...arr1]
//["aa","bb","cc"]

3.连接数组

ES6之前我们用Array对象的concat去连接对象如下所示：

var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr3 = arr1.concat(arr2);

用扩展语法

var arr1 = [0, 1, 2];
var arr2 = [3, 4, 5];
arr3 = [...arr1,...arr2];

四、展开对象字面量

ECMAScript提案（第4阶段）的其余/扩展属性将扩展属性添加到对象文字。它将自己提供的对象的枚举属性复制到一个新的对象上。使用较短的语法，可以轻松克隆（不包括原型）或合并对象Object.assign()。

var obj1 = { foo: 'bar', x: 42 };
var obj2 = { foo: 'baz', y: 13 };

var clonedObj = { ...obj1 };
// Object { foo: "bar", x: 42 }

var mergedObj = { ...obj1, ...obj2 };
// Object { foo: "baz", x: 42, y: 13 }

请注意，Object.assign()会触发setters，而展开语法不会。

五、只能用于可迭代对象

扩展语法（除扩展属性外）只能应用于可迭代对象：

var obj = {'key1': 'value1'};
var array = [...obj]; // TypeError: obj is not iterable