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 ]; //这样也可以
今天的分享就到这里,如果有什么不清楚明白的,可以私信我。如果文章有什么不对的地方,还望大神指教互相促进。生成器文章看下一篇。
再见,下一章再见。