本文主要是介绍【JavaScript】Iterator，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

Iterator

迭代器：迭代器是一种接口；其本质就是一个指针对象

Iterator 的作用：

1. 为各种数据结构，提供一个统一的、简便的访问接口
2. 使得数据结构的成员能够按某种次序排列
3. 主要供 for...of 使用

逻辑过程：

1. 创建一个指针对象，指向当前数据结构的起始位置
2. 第 1 次调用指针对象的 next()，指针就指向数据结构的第 1 个元素
3. 第 2 次调用指针对象的 next()，指针就指向数据结构的第 2 个成员
4. 不断调用指针对象的 next()，直到它指向数据结构的结束位置

封装迭代器

let arr = [12, 23, 34, 45];

arr.myIterator = function () {
    let i = 0;
    return {
        next: () => {
            let done = i >= this.length;
            let value = done ? undefined : this[i++];
            return {
                value,
                done
            };
        }
    };
};

let obj = arr.myIterator();

具有 Iterator 接口的数据结构：
① Array、② Map、③ Set、④ String、⑤ 函数的 arguments 对象、⑥ DOM 中的 NodeList 类数组对象

下面的例子是数组的 Symbol.iterator 属性：

let arr = ['a', 'b', 'c'];
let iter = arr[Symbol.iterator]();
iter.next() // { value: 'a', done: false }
iter.next() // { value: 'b', done: false }
iter.next() // { value: 'c', done: false }
iter.next() // { value: undefined, done: true }

下面是另一个类数组的对象调用数组的迭代器 Symbol.iterator 的例子：

let iterable = {
    0: 'a', // 属性名与下标一样
    1: 'b',
    2: 'c',
    length: 3,
    [Symbol.iterator]: Array.prototype[Symbol.iterator]
};

for (let item of iterable) {
    console.log(item); // 'a', 'b', 'c'
}

注意，普通对象部署数组的迭代器 Symbol.iterator，无效果

let iterable = {
    a: 'a', // 属性名与下标不一样
    b: 'b',
    c: 'c',
    length: 3,
    [Symbol.iterator]: Array.prototype[Symbol.iterator]
};
for (let item of iterable) {
    console.log(item); // undefined, undefined, undefined
}

字符串的包装类是一个类数组的对象，也具有 Iterator 接口

let str = "hi";
console.log(typeof str[Symbol.iterator]); // function

let iterator = str[Symbol.iterator]();
console.log(iterator.next()); // {value: "h", done: false}
console.log(iterator.next()); // {value: "i", done: false}
console.log(iterator.next()); // {value: undefined, done: true}

这篇关于【JavaScript】Iterator的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！