ES6扩展运算符

ES6扩展运算符实现了Iterator 接口的对象中的每个元素都一个个的迭代并取出来变成单独的被使用
eg1:

console.log(...[3, 4, 5])    // 结果  3 4 5

合并数组,可以使用扩展运算符将多个数组进行合并。

let arr1 = [1, 2, 3]
let arr2 = [4, 5, 6]
let arr3 = [7, 8, 9]
console.log([...arr1, ...arr2, ...arr3])
结果: [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ]

与解构配合赋值,配合使用,可以从数组中提取除第一个以后的所有元素成另外一个数组。

let [var1, ...arr5] = [1, 2, 3, 4, 5, 6]
console.log(var1)
console.log(arr5)
结果: 
1
[ 2, 3, 4, 5, 6 ]

但要注意,与解构配合时,扩展运算符只能用在最后一个上,否则报错。

可以展开实现了Iterator 接口的对象
比如Map,Set,数组就是从Iterator接口实现来的,Object不是,所以扩展Object会报错。

扩展Set。
let set1 = new Set()
set1.add(1)
set1.add(2)
set1.add(3)
console.log(...set1)
结果: 1 2 3

扩展Map。
let map1 = new Map();
map1.set('k1', 1);
map1.set('k2', 2);
map1.set('k3', 3);
console.log(...map1)
结果: [ 'k1', 1 ] [ 'k2', 2 ] [ 'k3', 3 ]
注意,扩展出来的一个个的数组,按照map的键值对结构,每个数组都是2个元素,一个是key,一个是value。

如果扩展Object,就会报错。
let obj1 = {
  p1: 1,
  p2: 2,
  p3: 3
}
console.log(...obj1) 
结果: 报错。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值