美文网首页
如何让对象支持 for...of 遍历

如何让对象支持 for...of 遍历

作者: 莫帆海氵 | 来源:发表于2021-01-18 22:30 被阅读0次

假如给定下面的对象,如何让它支持使用 for...of 遍历获取它的每个属性的值。

let a = {
    a1: 1,
    a2: 2,
    a3: 3,
}

参照 Set.prototype.values 可遍历性

// new Set().values()

[[Entries]]
  No properties
__proto__: Set Iterator
  next: ƒ next()
  Symbol(Symbol.toStringTag): "Set Iterator"
  __proto__:
    Symbol(Symbol.iterator): ƒ [Symbol.iterator]()
__proto__: Object
[[IteratorHasMore]]: false
[[IteratorIndex]]: 0
[[IteratorKind]]: "values"

包含有 [Symbol.iterator] 的属性且 Iterator 的 next 方法的返回值

// new Set().values().next()

{value: undefined, done: true}

参照上面的只要定义实现 Iterator 接口

{
    [Symbol.iterator]: function() {
        return {
            next: () => {
                return {
                    value: undefined,
                    done: true
                }
            }
        }
    }
}

完整示例如下

let a = {
  a1: 1,
  a2: 2,
  a3: 3,
  [Symbol.iterator]: function(e) {
    let idx = 1
    return {
      next: () => {
        let v = this[`a${idx}`]
        idx += 1
        
        if (v) {
          return {
            value: v,
            done: false
          }
        }
        
        return {
          value: undefined,
          done: true
        }
      }
    }
  }
}

for...of 的输出结果如下

for (var iterator of a) {
    console.log(iterator)
}

// 输出
1
2
3

相关文章

网友评论

      本文标题:如何让对象支持 for...of 遍历

      本文链接:https://www.haomeiwen.com/subject/oqsfzktx.html