迭代器Iterator是一种接口,为各种不同的数据解构提供统一的访问机制。任何数据结构只要部署 iterator 接口,就可以完成遍历操作。
1)ES6 创造了一种新的遍历命令 for…of循环。iterator接口主要供 for…of消费
2)原生具备iterator接口的数据(可以用 for…of遍历)
a》Array
b》Arguments
c》nodelist
d》string
e》set
f》map
3)工作原理
a》创建一个指针对象,指向当前数据解构的起始位置
b》第一次调用对象的next方法,指针自动指向数据结构的对一个成员
c》接下来不断调用next 方法,指针一直往后移动,知道指向最后一个成员
d》没调用next方法返回一个包含value和done属性的对象
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22//声明一个数组 const xiyou = ["唐僧","孙悟空","猪八戒","沙僧"]; //使用for...of遍历数组(输出键值) for(let v of xiyou) { console.log(v)//依次输出唐僧、孙悟空、猪八戒、沙僧 } //对比for...in遍历数组(输出键名) for(let v in xiyou) { console.log(v)//依次输出0,1,2,3 } //1、获取指针对象 let iterator = xiyou[Symbol.iterator](); //2、调用next() 方法 console.log(iterator.next())//{value:"唐僧",done:false} console.log(iterator.next())//{value:"孙悟空",done:false} console.log(iterator.next())//{value:"猪八戒",done:false} console.log(iterator.next())//{value:"沙僧",done:false} console.log(iterator.next())//{value:undefined,done:true}
二、自定义遍历数组
复制代码
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30//声明一个对象 const banji = { name:"终极一班", stus:[ "xiaoming", "xiaotian", "xiaoning", "knight" ], [Symbol.iterator](){ let index = 0; let _this=this; return{ next:function(){ if(index<_this.stus.length){ const result = {value:_this.stus[index],done:false}; index++ return result; }else{ return {value:undfined,done:false} } } } } }; for(let v of banji){ console.log(v)//依次输出 xiaoming,xiaotian,xiaoning,knight }
最后
以上就是霸气流沙最近收集整理的关于迭代器Iterator的全部内容,更多相关迭代器Iterator内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复