reset ... 扩展运算符

ES6 引入 reset 参数（形式为 ...变量名），用于获取函数的多余参数，这样就不需要使用 arguments对象了。reset 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。

1. 扩展运算符,reset运算符

写法就是... 三个点

两个作用,扩展和剩余

1.1 扩展运算符

let arr = ['a', 'b', 'c']

console.log(...arr)  // a b c 

// ...arr  展开数组

1.2 重置运算符,配合函数使用

其实就是将数组a展开

function show(...a){
    console.log(a);  // [1, 2, 3, 4, 5]
}
show(1,2,3,4,5);  

1.3 解决了arguments问题

arguments对象不是数组，而是一个类似数组的对象。所以为了使用数组的方法，必须使用Array.prototype.slice.call先将其转为数组。rest 参数就不存在这个问题，它就是一个真正的数组，数组特有的方法都可以使用。下面是一个利用 rest 参数改写数组push方法的例子。

function show(){
    console.log(arguments);  // Arguments(5) [1, 2, 3, 4, 5, callee: ƒ, Symbol(Symbol.iterator): ƒ]
}
show(1,2,3,4,5);


// 如果想把arguments这个类数组变成数组
function show(){
    let arr = Array.prototype.slice.call(arguments)
    console.log(arr);  // [1, 2, 3, 4, 5]
}
show(1,2,3,4,5);

// 如果想给这个数组排序
function show(){
    let arr = Array.prototype.slice.call(arguments)
	arr.sort(function(a,b){return a-b});
    console.log(arr); 
}
show(1,102,32,14,5);     //[1, 5, 14, 32, 102]

但是如果用ES6排序

function show(...arr){
    arr.sort(function(a,b){return a-b});
    console.log(arr);  
}
show(1,102,32,14,5);   // [1, 5, 14, 32, 102]

1.4 传参时扩展

我们还可以在传参的时候扩展

// 解构方法
function show([a,b,c]){
    console.log(a,b,c);  
} 
show([1,9,6]);     //  1 9 6

// 扩展运算符,我在实参的时候就让你扩展
function show(a,b,c){
    console.log(a,b,c);  
} 
show(...[1,9,6]);  // 1 9 6

1.5 又叫剩余运算符

function show(a,b,c){
    console.log(a,b,c);  
} 
show(1,2,3,4,5);  // 1 2 3

这样我们abc拿到的就是1,2,3其他的是不是就没管啊

剩余运算符就是将剩余的参数放到一个数组中

function show(a,b,...c){
    console.log(a,b,c);  
} 
show(1,2,3,4,5);  // 1 2 [3,4,5]

// 这个时候发现c是出了a,b对应的那两项外剩余的所有参数组成的数组

如果当成剩余运算符来用必须放最后

注意哦!下面的写法会报错

function show(a,...b,c){
    console.log(a,b,c);  
} 
show(1,2,3,4,5);  // 报错

如果我们需要复制一份数组,

var arr = [2,3,6,5,8];
var arr2 = [...arr];

// 以前Array身上还有一个from方法,拷贝数组
var arr = [2,3,6,5,8];
var arr2 = Array.from(arr);

// 这个方法还可以将字符串变成数组
var str = "abc";
var arr = Array.from(str); 
console.log(arr);   //["a", "b", "c"]

总结

1. 展开数组

…[1,2,3] ==> 1,2,3

2. 重置为数组

… 1,2,3 ==> [1,2,3]; 只能在传参的时候用

3. 剩余参数,必须放到最后

function(a,b,…c){}

1.6 函数的length不包括rest参数

(function(a) {}).length  // 1
(function(...a) {}).length  // 0
(function(a, ...b) {}).length  // 1