学习笔记20230508--es6新特性 打散数组和解构赋值 (应用层面)

64 阅读1分钟

在今天学习的过程中,对es6的新特性 打散数组和解构赋值有了全新的认识,现学习分享如下.....

欢迎各位大神们指教纠错😁

打散数组 ...

  1. 无法打散对象{a:1,b:2,c:3}
var a={a:1,b:2,c:3};console.log([...a])
// VM333:1 Uncaught TypeError: a is not iterable
  1. 除了可以打散数组,还可以打散map,set,等迭代对象
var [a,b]=[1,2,3]; 
var map=new Map();map.set(a,2);map.set(b,2);console.log(map)
// Map(2) {1 => 2, 2 => 2}
var map=new Map();map.set(a,2);map.set(b,2);console.log(...map)
// [1,2]  [2,2]
var map=new Map();map.set(a,2);map.set(b,2);console.log([...map])
// [[1,2] ,[2,2]]


var set=new Set();set.add(1);set.add(2);set.add(3);console.log(...set)
//Set(3) {1, 2, 3}
var set=new Set();set.add(1);set.add(2);set.add(3);console.log(...set)
// 1 2 3
var set=new Set();set.add(1);set.add(2);set.add(3);console.log([...set])
// [1, 2, 3]

解构赋值可这样用

Map(3) {
'字段1' => Set(2) { '甲', '乙' },   
'字段2' => Set(2) { 'a', 'b' },    
'字段3' => Set(3) { 1, 2, 3 }    
}

假设fields为上述的映射,算出一个映射值种集合数的乘积

console.log([...fields].reduce((s,[,v])=>{return s*=v.size}))

代码解析:

// [...fileds] 
//  打散映射, 将每条映射打散为一个数组,放进一个大数组中
//  [ ['字段1',Set(2) { '甲', '乙' }] , [字段2' ,Set(2) { 'a', 'b' }] , ['字段3',Set(3) { 1, 2, 3 }] ]

// [,v]
//解构赋值,v就是每一个数组中的集合

// v.size
// 集合的个数