迭代器接口

Posted 2020-12-15 yess

在ES6中，只实现了迭代器接口（Symbol.iterator），并没有实现迭代器接口类，有四种情况会实现迭代器接口

　　1 使用迭代器接口方法的时候，如keys， values， entries等

　　2 在解构的时候

　　3 在创建map，set对象的时候

　　4 在使用for of循环的时候

迭代器的作用：

　　1 定义了我们访问数据的次序

　　2 为for of提供了访问数据的方式

　　3 让所有数据具备统一的接口，方便而快捷的获取数据

注意：类数组对象实现了迭代器接口， 对象没有实现迭代器接口

 

实现迭代器接口：

<script>
    // 实现迭代器接口 即可通过for of方法 又可以通过next方法遍历的迭代器
    var obj = {
        0: ‘red‘,
        1: ‘green‘,
        2: ‘blue‘,
        // 具备length
        length: 3,
        // 具备索引值
        index: 0,
        // 复用数组的迭代器接口
        // 具备Symbole.iterator
        [Symbol.iterator]: Array.prototype[Symbol.iterator],
        // 具备next
        next() {
            // 按照一定的顺序访问数据
            if(this.index < this.length) {
                // 返回数据
                return {value: obj[this.index++], done: false}
            } else {
                // 遍历完成了
                return {value: undefined, done: true}
            }
        }
    };

    console.log(obj);
    // 测试
    console.log(obj.next());
    console.log(obj.next());
    console.log(obj.next());
    console.log(obj.next());
    
    // 没有实现迭代器接口，不能使用for of循环
    for(let item of obj) {
        console.log(item)
    }
    </script>