用generator实现自定义数组遍历的核心是function*定义生成器函数并用yield逐个产出值,支持正序、倒序、分块等遍历方式,且可通过闭包维护状态、接收next()参数实现双向通信与复杂控制。

用 generator 实现自定义数组遍历,核心是用 function* 定义生成器函数,配合 yield 逐个产出值,再通过 for...of、next() 或扩展运算符消费。它不改变原数组,只控制“什么时候返回哪个值”。
基础写法:按顺序遍历
最简单的自定义就是重现实现默认遍历逻辑,但你可以随时插入处理逻辑:
function* arrayIterator(arr) {
for (let i = 0; i const nums = [10, 20, 30];
const it = arrayIterator(nums);<p>console.log(it.next().value); // 10
console.log(it.next().value); // 20
console.log([...arrayIterator(nums)]); // [10, 20, 30]
</p>
跳过/过滤元素(如只遍历偶数)
在 yield 前加判断,就能跳过不符合条件的项,消费者完全感知不到被跳过的元素:
- yield 只在满足条件时执行,相当于“按需吐出”
- 遍历结果长度可能小于原数组,且不连续
- 适合实现类似
filter的惰性版本
function* evenOnly(arr) {
for (const item of arr) {
if (item % 2 === 0) yield item;
}
}
<p>[...evenOnly([1, 2, 3, 4, 5])]; // [2, 4]
</p>
反向遍历或分块遍历
generator 不受限于正向索引,你可以倒着走、每次 yield 多个、甚至交错处理:
- 反向:从
arr.length - 1往下递减 - 分块:用嵌套循环,每轮 yield 一个子数组
- 带索引:
yield { index, value }返回结构化数据
function* reverseIterator(arr) {
for (let i = arr.length - 1; i >= 0; i--) {
yield arr[i];
}
}
<p>function* chunkIterator(arr, size) {
for (let i = 0; i </p><p>[...reverseIterator(['a', 'b', 'c'])]; // ['c', 'b', 'a']
[...chunkIterator([1,2,3,4,5], 2)]; // [[1,2], [3,4], [5]]
</p>
结合状态做复杂控制(如交替、限流、暂停)
generator 函数体内可维护局部变量,实现有状态的遍历逻辑:
- 用闭包变量记住上一次位置、计数、开关状态等
-
yield后可接收next(value)传入的参数,实现双向通信 - 适合模拟迭代器协议、实现分页加载、节流遍历等场景
function* throttleIterator(arr, interval = 1000) {
let i = 0;
while (i setTimeout(resolve, interval));
}
}
// 注意:这个需要 async/await 配合,实际使用中常封装为异步迭代器(AsyncGenerator)
generator 的本质是把“遍历逻辑”从固定模式解放出来——你决定何时 yield、yield 什么、是否中断、是否携带上下文。只要返回的是迭代器对象(有 next() 方法),就能被标准语法消费,不需要改写业务层的 for...of 或展开操作。
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











