ES6-day03（一） (数组去重复Set,Map(删除,获取元素,遍历元素,对象转数组),遍历器/迭代器)

1.数组去重复

let arr = [30,20,20,20,30,10];
let set2 = new Set(arr);
console.log(set2);//Set { 30, 20, 10 }
//将set转成数组
let arr2 = [...set2];
console.log(arr2);//[ 30, 20, 10 ]

//将上面的步骤简写,得到去重复数据的数组
console.log([...new Set(arr)]); //[ 30, 20, 10 ]

  用set实例作为过渡,将数组存入set实例中 , set实例会自动将重复的数值去除 , 只留下一个 , 然后再将set实例转换为数组就得到了去重复的数组

2.Map

  创建的map实例中存放key值和value值 , 打印时出来的是键值对 , 一个key值对应一个value值

let map =new Map();
//添加元素
//set(key值,value值);
map.set('test','hello');
let obj = {name :'zhangsan'};
map.set(obj,'world');
console.log(map);//Map { 'test' => 'hello', { name: 'zhangsan' } => 'world' }
 map.set('test',{});//设置与上相同的key值就会覆盖
console.log(map);//Map { 'test' => {}, { name: 'zhangsan' } => 'world' }

  删除成员,获取元素,及遍历各属性

// 删除成员
map.delete('test');
console.log(map); //Map { { name: 'zhangsan' } => 'world' }
//  获取元素个数
console.log(map.size); //2
//遍历
let keys = map.keys();
let values = map.values();
let entries = map.entries();
console.log(keys,values,entries);

for (let key of keys){
    console.log(key);  //打印出所有key值
}
for (let value of values){
    console.log(value);  //打印出所有value
}
 for (let entrie of entries){
     console.log(entrie);  //打印所有键值对
 }

  将对象转成数组map

let obj2 = {name:'zhangsan',age:12,gender:'male'};
//在new Map时调用原型对象的entries传入对象,就可以把对象的键值对传入Map中,变成对象
let map2 = new Map(Object.entries(obj2));//Map { 'name' => 'zhangsan', 'age' => 12, 'gender' => 'male' }
let map2 = new Map([
    ['name','zhangsan'],
    ['age',12],
    ['gender','male']
]); //不用原型对象的函数,手动添加与上效果相同的数组  Map { 'name' => 'zhangsan', 'age' => 12, 'gender' => 'male' }

console.log(map2);  //Map { 'name' => 'zhangsan', 'age' => 12, 'gender' => 'male' }

3.遍历器/迭代器

Iterator 接口的目的，就是为所有数据结构，提供了一种统一的访问机制，即 for…of循环。当使用for…of循环遍历某种数据结构时，该循环会自动去寻找 Iterator 接口。一种数据结构只要部署了 Iterator 接口，我们就称这种数据结构是“可遍历的 ”（iterable）。
  上面是官方解释,简单来说就是有iterator接口才能用for … of方法来遍历数组 , 而自带这种接口的数据结构有
具有原生iterator接口的数据结构
/*
*Array

• Map
• Set
• String
• 函数的 arguments 对象
• NodeList 对象
  */

下面是遍历的原理 , 有一个next方法中的next指针从数组开始 ,每次往后移动一个,直到遍历整个数组

let set = new Set([10,20,20,20,30]);
//console.log(set);  //Set { 10, 20, 30 }
//获取到一个遍历器对象
let values = set.values();
console.log(values);  //[Set Iterator] { 10, 20, 30 }
console.log(values.next());  //{ value: 10, done: false }
console.log(values.next());  //{ value: 20, done: false }
console.log(values.next());  //{ value: 30, done: false }
console.log(values.next());  //{ value: undefined, done: true }  next的指针已经指到末尾