ES6扩展运算符 ...

ES6 扩展运算符 三点(…)
参考

含义

扩展运算符( spread )是三个点(…)。它将一个数组转为用逗号分隔的参数序列。

console.log(...[1, 2, 3])  
// 1 2 3  
console.log(1, ...[2, 3, 4], 5)  
// 1 2 3 4 5  
[...document.querySelectorAll('div')]  
// [<div>, <div>, <div>] 

该运算符主要用于函数调用。

function push(array, ...items) {  //item是数组类型。
	array.push(...items);  
}  

function add(x, y) {  
return x + y;  
}  
var numbers = [4, 32];  
add(...numbers) // 相当于第一步先讲数组转为逗号分割的序列4,32,再将序列作为参数调用函数,结果===>add(4,32)===》36

运用扩展运算符替代数组的 apply 方法:
应用Math.max方法,简化求出一个数组最大元素的写法。

// ES5 的写法  
Math.max.apply(null, [14, 3, 77])  
// ES6 的写法  
Math.max(...[14, 3, 77])  
//  等同于  
Math.max(14, 3, 77);  

运用扩展运算符将一个数组添加到另一个数组的尾部:

var arr1;  
var arr2;  
arr1.push(...arr2);//push方法的参数不能是数组

运用扩展运算符合并数组:

//ES5合并数组
[a1,a2,a3].concat(anotherarr);
[a1,a2,a3,...anotherarr];
//ES6合并数组
arr1.concat(arr2,arr3);
[...arr1,...arr2,...arr3];

扩展运算符可以与解构赋值结合起来,用于生成数组:

// ES5  
a = list[0], rest = list.slice(1)  
// ES6  
[a, ...rest] = list  
下面是另外一些例子。  
const [first, ...rest] = [1, 2, 3, 4, 5];  
first // 1  
rest // [2, 3, 4, 5]  
const [first, ...rest] = [];  
first // undefined  
rest // []:  
const [first, ...rest] = ["foo"];  
first // "foo"  
rest // []  

如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错:



const [...butLast, last] = [1, 2, 3, 4, 5];  
//  报错  
const [first, ...middle, last] = [1, 2, 3, 4, 5];  
//  报错  


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值