概念
interator 是一种接口机制,为各种不同的数据结构提供统一的访问机制
作用
- 为各种数据结构,提供一个统一的、简便的访问接口
- 使得数据结构的成员能够按某种次序排列
- Es6创造了一种新的遍历命令for...of循环,Interator接口主要提供for..of消费。
原理
- 创建一个指针对象,指向数据结构的起始位置,
- 第一种调用next方法,指针自动指向数据结构的第一个成员
- 接下来不断调用next方法,指针会一直往后移动,直到指向最后一个成员
- 每次调用next方法返回的是一个包含 value和done的对象,{value:当前成员的值,done:布尔值}
- value表示当前成员的值,done对应的布尔值表示当前的数据结构是否遍历结束
- 当遍历结束的时候返回的value值为undifined,done的值为false
简单实现
接下来我们简单实现上面的原理方便我们理解interator
如下实现对数组的迭代 这里我们利用了闭包使每次调用next都会使指针往后移一位,当数组没有值可迭代时返回 {value:undifind,done:false}
代码语言:javascript复制function Interator(arr){
var index = 0;//指针
//指针对象
return {
next:function(){
//返回当前成员值和done
return {value:arr[index ],done:index>arr.length?false:true}
}
}
}
var arr = [1,2,3,4]
var myIterator = Interator(arr)
console.log(myIterator.next())
console.log(myIterator.next())
console.log(myIterator.next())
console.log(myIterator.next())
console.log(myIterator.next())
//返回值
/*
{value: 1, done: true}
{value: 2, done: true}
{value: 3, done: true}
{value: 4, done: true}
{value: undefined, done: false}
*/
使用for...of
在Es6中已经将interator(类似上面逻辑)接口部署到指定的数据类型上,只要数据类型部署了interator就可以使用for...of循环遍历,没有部署则不能使用for...of 支持interator的数据类型有 数组、字符串、arguments、set容器、map容器
代码语言:javascript复制var arr = [1,2,3]
for(let i of arr){
console.log(i)
}
/*
1
2
3
*/
var str = 'word'
for(let i of str){
console.log(i)
}
/*
w
o
r
d
*/
function fun(){
for(let i of arguments){
console.log(i)
}
/*
test
text
*/
}
fun('test','text')
普通对象不能使用for..of
代码语言:javascript复制var obj = {name:'zt',sex:'1'}
for(let i of obj){
console.log(i)
}
//Uncaught TypeError: obj is not iterable