JS中迭代器和生成器

JS中迭代器和生成器

one. 迭代器

one. 什么是迭代?

就好比一个产品更新下一代产品，下一代产品。我这样说也许很抽象，JS中迭代就是从一个数据集合中按照一定的顺序，不断取出数据的过程。

two. 迭代和遍历有什么区别呢？

区别肯定是有的，如果没有的话那就不需要迭代了。* 迭代强调的是依次取数据，并不保证取多少，也不保证把所有的数据取完。 *** 遍历强调的是把数据依次全部取出。

three. 迭代器

对迭代过程的封装。迭代器其实就是一个对象。 *迭代器应该具有得到下一个数据的能力。 **迭代器应该具有判断是否还有后续数据的能力。

four. JS中的迭代器

JS规定，如果一个对象具有一个next方法，并且该方法返回一个对象，这个对象的属性有value，done。那么这个对象就是一个迭代器。下面obj就是一个迭代器。value：表示下一个数据值，done是一个boolean值，为true时数据取完了。

const obj = {
	next(){
		return {
			value: xxxx,
			done: boolean
		}
	}
}

举例：

const arr = [1,2,3,4,5]
const obj = {
	i: 0,
	next(){
		return {
			value: arr[this.i ++],
			done: this.i >= arr.length;
		}
	}
}

//obj.next(); // 1
//obj.next(); // 2
//obj.next(); // 3
//obj.next(); // 4
//obj.next(); // 5  这样写就等同于下面

let result = obj.next(); // 1
while(!result.done){
	console.log(result.value) //这个就是数组中每项的值
	result = obj.next();
}

five. 可迭代对象和for-of循环

ES6规定，一个对象具有知名符号Symbol.iterator属性，并且该属性是一个迭代器构造函数，那么这个对象就是一个可迭代对象。如下：

const obj = {
	[Symbol.iterator](){
		return {
			next(){
				return {
					value: xxxx,
					done: boolean
				}
			}
		}
	}
}

for-of循环并不是循环数组，而是循环可迭代对象。

const obj = {
	name: 'xxx',
	age: 20,
	[Symbol.iterator](){
		const keys = Object.keys(); //对象中的每一个属性值，组成一个数组
		let i = 0;
		return {
			next: ()=>{
				return {
					value: {key: keys[i], value: this[keys]},
					done: i >= keys.length
				}
			}
		}
	}
}

//const iterator = obj[Symbol.iterator]();//返回一个迭代器
//let result = iterator.next();
//while(!result.done){
	//console.log(result.value) //这个就是数组中每项的值 {key: name, value: 'xxx'
	//result = obj.next();
//}

上面的写法就是下面这种写法
for(const item of obj){
	console.log(item);  //这个就是数组中每项的值 {key: name, value: 'xxx'
}

举例
这样会报错，而上面例子不会报错

const obj = {
	name: 'xxx',
	age: 20,
	sex: '男'
}

for(const item of obj){
	console.log(item);  //结果就会报错
}

for-of循环数组

	const arr = [1,2,3,4,5];
	for(const item of arr){
		console.log(item) 
	}
	//输出结果是  1 2 3 4 5
	//那for-of 和 for循环有什么区别呢？

这样写就会报错

const arr = [1,2,3,4,5];
Array.prototype[Symbol.iterator] = null;
for(const item of arr){
	console.log(item) 
}
//就会报错。for-of循环并不是循环数组，而是循环可迭代对象。

six. 展开运算符还可以用作于可迭代对象

const obj = {
	name: 'xxx',
	age: 20,
	sex: '男'
}

//const objone = { ...obj } //这样是可以的。
const obj = [ ...obj ]; //这样就不行

而下面这样就可以

const obj = {
	name: 'xxx',
	age: 20,
	[Symbol.iterator](){
		const keys = Object.keys(); //对象中的每一个属性值，组成一个数组
		let i = 0;
		return {
			next: ()=>{
				return {
					value: {key: keys[i], value: this[keys]},
					done: i >= keys.length
				}
			}
		}
	}
}

//const objone = { ...obj } //这样是可以的。
const obj = [ ...obj ]; //这样也可以

今天的分享就到这里，如果有什么不清楚明白的，可以私信我。如果文章有什么不对的地方，还望大神指教互相促进。生成器文章看下一篇。

再见，下一章再见。