「这是我参与2022首次更文挑战的第 4 天,活动详情查看:2022首次更文挑战」。
什么是迭代器?
迭代器是帮助我们对某个数据结构进行遍历的对象, 它有一个 next 方法, next 方法返回一个对象
{
done: boolean, // 为 true 时代表迭代完毕
value: any // done 为 true 时取值为 undefined
}
模拟实现一个迭代器:
function test1() {
function createArrayIterator(arr) {
let index = 0
return {
next: () =>
index < arr.length
? { value: arr[index++], done: false }
: { value: undefined, done: true },
}
}
// 测试
const nums = [11, 22, 33, 44]
const numsIterator = createArrayIterator(nums)
console.log(numsIterator.next())
console.log(numsIterator.next())
console.log(numsIterator.next())
console.log(numsIterator.next())
console.log(numsIterator.next())
}
test1()
可迭代对象
实现了生成迭代器方法的对象称为 可迭代对象
也就是说这个对象中包含一个方法, 该方法返回一个迭代器对象
一般使用 Symbol.iterator
来定义该属性, 学名叫做 @@iterator
方法
function test2() {
// 一个可迭代对象需要具有[Symbol.iterator]方法,并且这个方法返回一个迭代器
const obj = {
names: ['111', '222', '333'],
[Symbol.iterator]() {
let index = 0
return {
next: () =>
index < this.names.length
? { value: this.names[index++], done: false }
: { value: undefined, done: true },
return: () => {
console.log('迭代器提前终止了...')
return { value: undefined, done: true }
},
}
},
}
for (const item of obj) {
console.log(item)
if (item === '222') break
}
}
test2()
这样我们就可以使用 for of
等方法对该对象就行遍历了, 并且当遍历中途停止的时候, 还会调用迭代器对象的 return
方法
一些原生实现了 @@iterator
方法的对象: String、Array、Map、Set、arguments 对象, 所以我们才能对这些对象进行遍历
使用生成器来创建一个迭代器
我们知道生成器函数的返回值就是一个迭代器对象, 所以我们可以使用生成器来创建迭代器
function test3() {
const obj = {
names: ['111', '222', '333'],
[Symbol.iterator]: function* () {
for (const name of this.names) {
yield name
}
},
}
for (const item of obj) {
console.log(item)
}
}
test3()
或者使用 yield* 这个语法糖使得代码更简洁:
const obj = {
names: ['111', '222', '333'],
[Symbol.iterator]: function* () {
yield* this.names
},
}
主要是学习一些原生对象为什么可以被遍历的原理, 实际开发中使用场景较少