Skip to content
陈广亮的技术博客
Go back

ES6 Iterator 遍历器详解

Iterator 是一种接口,为各种不同的数据结构提供统一的访问机制。它也是解构赋值、扩展运算符、Generator、for…of 的实现基础。

原生具备 Iterator 的数据结构

Array、Map、Set、String、TypedArray、arguments、NodeList

让对象支持 for…of

方式一:实现 Symbol.iterator

class RangeIterator {
  constructor(start, stop) {
    this.value = start;
    this.stop = stop;
  }
  [Symbol.iterator]() { return this; }
  next() {
    if (this.value < this.stop) {
      return { done: false, value: this.value++ };
    }
    return { done: true, value: undefined };
  }
}

for (var value of new RangeIterator(0, 3)) {
  console.log(value); // 0, 1, 2
}

方式二:借用 Array 的迭代器

let iterable = {
  0: "a", 1: "b", 2: "c",
  length: 3,
  [Symbol.iterator]: Array.prototype[Symbol.iterator],
};

方式三:Generator 函数

let obj = {
  *[Symbol.iterator]() {
    yield "hello";
    yield "world";
  },
};

方式四:Object.keys 遍历

for (var key of Object.keys(someObject)) {
  console.log(key + ": " + someObject[key]);
}

Share this post on:

Previous Post
Webpack 4 升级指南
Next Post
如何在 git commit 时添加 ESLint 校验