06 Web全栈 ES6规范(可迭代协议和迭代器协议)

Iterator 和for…of循环

迭代器协议
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Iteration_protocols

可迭代协议和迭代器协议

// 迭代器协议 有next函数 返回done value
var isHomeYou = {
	cursor: 0,
	next () {
		const actions = ['douyin', 'chifan', 'shuijiao']
		if (this.cursor > 2) {
			return {
				done: true
			}
		}
		return {
			done: false,
			value: actions[this.cursor++]
		}
	},
	// 可迭代协议
	[Symbol.iterator]() {
   	 	return this;
  	},
}

为什么要有两个协议
不可能知道一个特定的对象是否实现了迭代器协议，然而创造一个同事满足迭代器协议和可迭代协议的对象是很容易的。这样就允许一个迭代器能被不同希望迭代的语法方式所使用。因此，很少只实现迭代器协议而不实现可迭代协议。

都有哪些语法或特征，使用或实现了可迭代协议与迭代器协议
for…of / … / Array.from 使用了迭代器协议
[] / Set / Map / generator 实现了Iterators

Generator函数与异步应用

Generator函数返回的是实现了可迭代协议与迭代器协议的对象
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Generator

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

const gen = generator(); // "Generator { }"

console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3

// next传递参数

async

async 函数是使用async关键字声明的函数。async 函数是 AsyncFunction 构造函数的实例，并且其中允许使用 await 关键字。async 和 await 关键字让我们可以用一种更简洁的方式写出基于 Promise 的异步行为，而无需刻意地链式调用 promise。
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/async_function

function resolveAfter2Seconds() {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('resolved');
    }, 2000);
  });
}

async function asyncCall() {
  console.log('calling');
  const result = await resolveAfter2Seconds();
  console.log(result);
  // Expected output: "resolved"
}

asyncCall();