reset ... 扩展运算符

文章目录

1. 扩展运算符,reset运算符1.1 扩展运算符1.2 重置运算符,配合函数使用1.3 解决了arguments问题1.4 传参时扩展1.5 又叫剩余运算符 总结1.6 函数的length不包括rest参数 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,2,3] ==> 1,2,3

重置为数组

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

剩余参数,必须放到最后

function(a,b,…c){}

1.6 函数的length不包括rest参数

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