ES6 迭代器、Set和Map

ES6 迭代器、Set和Map学习详解

    • 1. ES6 迭代器
      • 1.1 什么是迭代器?
      • 1.2 迭代器的作用
    • 2. Set集合
      • 2.1. 什么是Set?
    • 3. Map

1. ES6 迭代器

1.1 什么是迭代器?

迭代器(Iterator)是一种机制,它的底层部署了Iterator接口。任何部署Iterator接口的数据结构都可以完成遍历操作。迭代器主要供for…of消费。

迭代器实现了Iterator接口,只要实现了Iterator就可以使用for-of遍历

// console.log(Object.keys());
var arr = [1,2,3,4]
// keys values entries 当前变量是迭代器对象
console.log(arr.keys());
console.log(arr.values());
console.log(arr.entries());

Iterator的遍历过程:

  1. 创建一个指针对象,指向当前数据结构的起始位置。也就是说,遍历器对象本质上,就是一个指针对象。
  2. 第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。
  3. 第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。
  4. 不断调用指针对象的next方法,直到它指向数据结构的结束位置。

for…of实现原理:
for-of实现原理就是调用迭代器的next()方法,第一次调用将指针指向数据结构的第一个成员,依次调用依次指向,直到没有成员可以指向,done为true

var arr = [1,2,3,4]
let keys=arr.keys()
for(let key of keys){
    console.log(key)
}
while(!(result=keys.next()).done){
    console.log(result)
}

1.2 迭代器的作用

  • 为各种数据结构,,提供一个统一简单的访问接口
  • 能够有序的遍历数据结构成员
  • ES6 创造了新的遍历命令for…of循环

2. Set集合

2.1. 什么是Set?

Set 类似于数组,但是成员的值都是唯一的,没有重复的值。 Set 本身是一个构造函数,用来生成 Set 数据结构。

Set的常用方法

//key 和value是一样的
 //创建一个set数据结构
 let set = new Set();
//  1.添加成员
set.add('tom')
// 添加基本类型值会自动去重
set.add('jack')
set.add('jack') 
// 添加引用类型值不会去重,因为引用类型值的地址不一样
set.add([1])
set.add([1])
set.add({name:'lisi'})
// console.log(set);
//遍历
let keys = set.keys()
let values = set.values()
let entries = set.entries
console.log(keys);
console.log(values);
console.log(entries);
set.forEach((key)=>{
  console.log(key);
})
// 判断有没有某个成员 返回值为true或false
console.log(set.has('jack')); //返回true

Set的应用:
因为Set的成员都是唯一的没有重复的值,所以Set可以用来做数组去重。又因为Set集合不是数组,所以去重之后,要将其结果再转换为数组。

// 数组去重
let arr = [1,2,3,4,1,2,3,4]
let result = new Set(arr)
console.log(result)
//将set集合转换为数组
let [...arr2] = result
console.log(arr2);

3. Map

Map类似于对象,也是键值对的集合。Object 结构提供了“字符串—值”的对应,Map结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构,Map 比 Object 更合适。Map 可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。

map和object区别?
1.map的键可以是任意数据类型,object的键只能是字符串或者symbol
2.map是一个可迭代的数据结构 对象不可以直接迭代
3.map可以通过size属性获取数据结构长度 对象不可以直接获取
4.map循环遍历按照顺序进行输出 对象属性无序数据结构

let obj ={
  // 1:"1",
  // [Symbol('myname')]:'lisi',
  age:15
}
// console.log(obj);//{ '1': '1' }
let res = Object.entries(obj)
//创建一个map集合
let map =new Map(res)
// console.log(map);
//给map添加成员
map.set('name','zhangsan',)
map.set([1],'hello')
console.log(map);
//删除map成员
map.delete([1])
map.delete('name')
console.log(map);
// 获取元素
console.log(map.get('age'));
// 遍历
let keys=map.keys()
let values=map.values()
let entries=map.entries();
console.log(keys,values,entries);
map.forEach((value,key)=>{
    console.log(value,key)
})

你可能感兴趣的