ECMAScript6--16.Iterator

1.Iterator 和 for...of循环

• 什么是Iterator接口
  • 在js过程中操作某些数据结构，比如数组、Object对象、Map、Set都可以理解为是数据集合，数据集合怎么去读取这是一个问题；
  • 数据结构本身不同，怎么用相同办法的接口，让不同数据结构得到一个统一的读取方式；这就是Iterator这个接口要实现的功能；
• Iterator的基本用法
• for...of
  • for...of原理和Iterator有关；
  • for..of循环的过程就是不断调用Iterator接口来达到这个形式；
    • 通过for...of统一的这种形式达到读取不同数据结构的目标；

2.Iterator用法

{
 let arr = ['hello','world'];
 let map = arr[Symbol.iterator]();
 console.log(map.next()); //Object{value:"hello",done:false}
 console.log(map.next()); //Object{value:"world",done:false}
 console.log(map.next()); //Object{value:undefined,done:true}
//返回了一个对象，有两个选项，一个value（数组的第一项），一个done（这循环是不是还有下一步），
 done：false；说明循环并没有结束，done：true没有下一步了； 
}

3.自定义Iterator接口

不管要遍历什么样的数据结构，这个数据结构可能复杂可能简单，如果想自定义部署这个方法，一定要按照这个操作；最后返回一个对象：这个对象要包含next()方法，next方法返回的值，是有两个一个value，一个done；

{
//遍历obj，达到先遍历start，在遍历end；
let obj ={
    start:[1,3,2],
    end:[7,9,8],
    [Symbol.iterator](){
        let self = this;
        let index = 0;
        let arr = self.start.concat(self.end);
        let len = arr.length;
        return{
            next(){
                if(index<len){
                    return {
                        value:arr[index++],
                        done:false
                    }
                }else{
                    return {
                        value:arr[index++],
                        done:true
                    
                    }
                }
            }
        
        }
    }

};   

for(let key of obj){
    console.log(key);
}
//遍历结果:
//1
//3
//2
//7
//9
//8
}

4.for...of循环

 {
  let arr = ['hello','world'];
  for(let value of arr){
      console.log('value',value);
  }
  //value hello
  //value world

}