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的指针已经指到末尾