Javascript迭代器

我们都知道可以用 for…of… 来循环可迭代对象，例如循环

Array
Arguments
Map
Set
String
TypedArray
NodeList

迭代器的工作原理

• 创建一个指针，指向当前数据结构的起始位置
• 第一次调用对象next方法，指针自动指向数据结构的第一个成员
• 接下来不断调用next，指针一直往后移动，直到指向最后一个成员
• 每调用一次next方法返回一个包含value和done属性的对象

为什么Object不可以被迭代

let arr = [1, 2, 3]
let obj = {
    a: 1,
    b: 2,
    c: 3
}
for(let val of arr) {
    console.log(val)
}
for(let val of obj) {
    console.log(val)
}

运行可以看到，数组正常循环没有问题，但是到了obj，会报：obj is not iterable（obj不是一个可迭代对象、obj不可被迭代）
这是为什么呢？将arr和obj分别使用 console.dir() 进行打印查看

可以看到，arr的原型上挂载着一个 Symbol[Symbol.iterator]，而obj的原型上并没有这个属性，因此这就是为什么obj不可以被迭代的原因
但是如果非得让obj也成为一个 可迭代对象，如何去实现呢？此时就需要给obj身上加上一个迭代器

let obj = {
    a: 1,
    b: 2,
    c: 3,
    [Symbol.iterator]: function () {
        let values = Object.values(obj)
        let index = 0
        /* 必须得return 一个对象出去 */
        return {
            /* 这是固定写法 */
            next() {
                if (index >= values.length) {
                    return {
                        done: true // 此时迭代结束，就不需要再return value出去
                    }
                } else {
                    return {
                        value: values[index++],
                        done: false
                    }
                }
            }
        }
    }
}
for (let item of obj) {
    console.log(item)
}

运行上方的代码，此时obj已经可以使用 for…of… 进行循环，并且此时的obj已经是一个可迭代对象

转自 Javascript迭代器 - 韩小韩博客