Iterator 和 for..of vs for...in

Iterator迭代器(遍历器)

提高访问具有遍历借口数据的效率

相当于指针(默认是-1)；

可遍历借口

有next方法(next将当前指针移动到下个位置，返回一个对象{value:,done:})

数组默认有迭代器属性

    var arr = [111,222,333];
    var aa = arr[Symbol.iterator]();
    aa.next(); // { value: 111, done: false }
    aa.next(); // { value: 222, done: false }
    aa.next(); // { value: 333, done: false }
    aa.next(); // { value: undefined, done: true }

可以用在 数组 Map Set 类数组

    var m = new Set([11,22,33]);//set类似于数组
    console.log(m);
    var qq=m[Symbol.iterator]();
    console.log(qq.next());//{value: 11, done: false}

    var s = new Map([['name','shi'],['age',3]]);
    s.set("sex",'nv')
    console.log(s);
    var i=s[Symbol.iterator]();
    console.log(i.next());

类数组

    var try=document.getElementsByName("div");
    console.log(try);

自定义遍历器

    var arr = [111,222,333];
    function aa(arr){
    var i=-1;
    function next(){
        i++;
        let value;
        let done=false;

        if (i==arr.length) {
            value=undefined;
            done=true;
        }else{
            value=arr[i];
        }
        return{value:value,done:done};
    }
    return {next:next};
}

    var zz=aa(arr); 
    console.log(zz.next());//Object {value: 111, done: false}
    console.log(zz.next());//Object {value: 222, done: false}
    console.log(zz.next());//Object {value: 333, done: false}
    console.log(zz.next());//Object {value: undefined, done: true}
    

for..of vs for...in

普通循环遍历

var arr=[1,2,3,4,5,6];
for (var i = 0, l = arr.length; i<l; i++) {
    console.log(arr[i]);
};
arr.forEach(i=>{
    console.log(i);
})

迭代器遍历

var bb=arr[Symbol.iterator]();
var cc=bb.next();
while(!cc.done){
    console.log(cc.value);
    cc=bb.next();
}

for of array 遍历

for(var item of arr){
    console.log(item);
} 

for of set 遍历

var s=new Set(['a','b','c']);
for(var item  of s){
    console.log(item);
}

for in 用来遍历对象

// 
var obj={
    x:1,y:2,z:3
}
for(var i in obj ){
    console.log(i)//x,y,z
    console.log(obj[i]);//x 1 y 2 z 3
}