# 迭代器

迭代器是被设计专用于迭代的对象，带有特定接口。所有的迭代器对象都拥有 next() 方法，会返回一个结果对象。该结果对象有两个属性：对应下一个值的 value ，以及一个布尔类型的 done ,其值为 true 时表示没有更多值可供使用。迭代器持有一个指向集合位置的内部指针，每当调用了 next() 方法，迭代器就会返回相应的下一个值。

在 ES5 中创建一个迭代器

function createIterator(items) {
    var i = 0;
    return {
        next: function () {
            var done = i >= items.length;
            var value = !done ? items[i++] : undefined
            return {
                done: done,
                value: value
            }
        }
    }
}

var iterator = createIterator([1, 2, 3]);
console.log(iterator.next());
console.log(iterator.next());
console.log(iterator.next());


console.log(iterator.next());  // "{ value: undefined, done: true }"

# 何为生成器

生成器 (generator) 是能返回一个迭代器的函数。生成器函数由放在 function 关键字之后的一个星号 (*) 来表示，并能使用新的 yield 关键字。将星号紧跟在 function 关键字之后，或是在中间留出空格，都是没问题的

function* createIterator() {
    yield 1;
    yield 2;
    yield 3;
}

执行上面的打印依然可以

生成器函数最有意思的方面可能就是它们会在每个 yield 语句后停止执行。此代码中 yield 1 执行后，该函数将不会再执行任何操作，直到迭代器的 next() 方法被调用，此时才继续执行 yield 2

和表达式一起使用

function* createIterator(items) {
    for (let i = 0; i < items.length; i++) {
        yield items[i]
    }
}

# 生成器对象方法

由于生成器就是函数，因此也可以被添加到对象中。例如，你可以在 ES5 风格的对象字面量中使用函数表达式来创建一个生成器：

var o = {
    createIterator: function* (items) {
        for (let i = 0; i < items.length; i++) {
            yield items[i]
        }
    }
}
let iterator = o.createIterator([1, 2, 3]);

用 ES6简写

*createIterator(items){
    //
}

# 可迭代对象与 for-of 循环

可迭代对象（ iterable ）是包含 Symbol.iterator 属性的对象

在 ES6 中，所有的集合对象(数组、 Set 与 Map) 以及字符串都是可迭代对象，因此它们都被指定了默认的迭代器。可迭代对象被设计用于与 ES 新增的 for-of 循环配合使用。

for-of 循环在循环每次执行时会调用可迭代对象的 next() 方法，并将结果对象的 value 值存储在一个变量上。循环过程会持续到结果对象的 done 属性变成 true 为止

let values = [1, 2, 3]
for (const num of values) {
    console.log(num)
}
// 1 2 3

这个 for-of 循环首先调用了 values 数组的 Symbol.iterator 方法，获取了一个迭代器
iterator.next() 被调用，迭代器结果对象的 value 属性被读出并放入了 num 变量。 num 变量的值开始为 1 ，接下来是 2 ，最后变成 3 。
当结果对象的 done 变成 true ，循环就退出了，因此 num 绝不会被赋值为 undefined 。

# 访问默认迭代器

使用 Symbol.iterator 来访问对象上的默认迭代器

let values = [1, 2, 3]
let iterator = values[Symbol.iterator]()

console.log(iterator.next());

# 检测对象是否能进行迭代

function isIterable(object) {
    return typeof object[Symbol.iterator] === 'function'
}

console.log(isIterable([]));  //true
console.log(isIterable(""));  //true
console.log(isIterable({}));  //false
console.log(isIterable(1));   //false  
console.log(isIterable(new Map()));  //true
console.log(isIterable(new Set()));  //true
console.log(isIterable(new WeakMap()));  //false
console.log(isIterable(new WeakSet()));  //false

# 创建可迭代对象

let collection = {
    obj: {},
    *[Symbol.iterator]() {
        for (const key in this.obj) {
            yield this.obj[key]
        }
    }
}
collection.obj.name = 'Tom'
collection.obj.age = 20
for (const iterator of collection) {
    console.log(iterator);
}

集合的迭代器

ES6 具有三种集合对象类型：数组、 Map 与 Set

entries():返回一个包含键值对的迭代器
values():返回一个包含集合中的值的迭代器
keys :返回一个包含集合中的键的迭代器

生成器的 Return 语句

由于生成器是函数，你可以在它内部使用 return 语句，既可以让生成器早一点退出执行，也可以指定在 next() 方法最后一次调用时的返回值。

function* createIterator() {
    yield 1;
    return;
    yield 2
    yield 3
}

let iterator1 = createIterator();
console.log(iterator1.next());  // { value: 1, done: false }
console.log(iterator1.next());  // { value: undefined, done: true }

# 异步任务运行

对于异步代码，forEach 并不能保证按顺序执行。forEach 中用 await 会产生什么问题?怎么解决这个问题?

async function test() {
	let arr = [4, 2, 1]
	arr.forEach(async item => {
		const res = await handle(item)
		console.log(res)
	})
	console.log('结束')
}

function handle(x) {
	return new Promise((resolve, reject) => {
		setTimeout(() => {
			resolve(x)
		}, 1000 * x)
	})
}

test()

我们期望的结果是:

4 2 1 结束

但是实际上会输出:

1 2 4 结束

问题原因

forEach底层怎么实现的。

// 核心逻辑
for (var i = 0; i < length; i++) {
  if (i in array) {
    var element = array[i];
    callback(element, i, array);
  }
}

forEach 拿过来直接执行了，这就导致它无法保证异步任务的执行顺序。比如后面的任务用时短，那么就又可能抢在前面的任务之前执行

解决方案 其实也很简单, 我们利用 for...of 就能轻松解决。

async function test() {
  let arr = [4, 2, 1]
  for(const item of arr) {
	const res = await handle(item)
	console.log(res)
  }
	console.log('结束')
}

解决原理——Iterator

for...of 并不像forEach那么简单粗暴的方式去遍历执行，而是采用一种特别的手段——迭代器去遍历。

← 原型-原型链 EventLoop →