es6的迭代器Symbol.iterator

使用es5语法模拟一个迭代器

function createIterator(item){
    var i = 0;
    return {
      next: function () {
        var done = (i>item.length);
        var value = !done ? item[i++] : undefined;
        return {
          value: value,
          done: done
        }
      }
    }
  }
  var arr = [1,2,4,6];
  var iterator = createIterator(arr);
  console.log(iterator.next()); // {value: 1, done: false}
  console.log(iterator.next()); // {value: 2, done: false}
  console.log(iterator.next()); // {value: 4, done: false}
  console.log(iterator.next()); // {value: 6, done: false}
  console.log(iterator.next()); // {value: undefined, done: true}

Symbol.iterator ES6新增

ES6中原生的迭代器有Array、Set、Map和String，for…of能够遍历它们是因为它们具有Symbol.iterator属性

该属性指向该数据结构的默认迭代器方法，当使用for…of…迭代该数据结构时

js引擎就会调用其Symbol.iterator方法，从而返回相应的默认迭代器。举例：

let arr = [1,2,4,6];
//也可以使用ES6提供的next()方法手工遍历
let iterator = arr[Symbol.iterator]();
console.log(iterator.next()); // {value: 1, done: false}
console.log(iterator.next()); // {value: 2, done: false}
console.log(iterator.next()); // {value: 4, done: false}
console.log(iterator.next()); // {value: 6, done: false}
console.log(iterator.next()); // {value: undefined, done: true}

Symbol.iterator 来检测对象是否为可迭代的对象

let arr = [];//true
let obj = {};//true
let str = '';//true
let map = new Map();//true
let set = new Set();//true
let num = 123;//false
let isIterator1 = typeof arr[Symbol.iterator] === "function";
let isIterator2 =  Object.prototype.toString.call( arr[Symbol.iterator] ) === "[object Function]"

生成器

生成器是一种返回迭代器的函数，通过function关键字后的星号(*)来表示，函数中会用到新的关键字yield

function* yieldIterator(list) {
    for (let i = 0; i < list.length; i++) {
      yield list[i]
    }
  }
  let arr = [1,2,4,6];
  let iterator = yieldIterator(arr);
  console.log(iterator.next()); // {value: 1, done: false}
  console.log(iterator.next()); // {value: 2, done: false}
  console.log(iterator.next()); // {value: 4, done: false}
  console.log(iterator.next()); // {value: 6, done: false}
  console.log(iterator.next()); // {value: undefined, done: true}

关于yield请移步该文章 https://web03.cn/blog/146