手动实现迭代器只需对象有next()方法并返回{value,done};关键三点:控制状态递增、done为true后不再返回value、next()无参或单参且结束态不可逆。

迭代器是 JavaScript 中统一遍历数据的“协议接口”,不是语法糖,而是可被 for...of、[...spread]、Array.from() 等直接消费的对象;generator 函数则是最便捷的迭代器工厂——它不返回值,而是返回一个符合迭代器协议的生成器对象。
怎么手动实现一个迭代器?关键就三点
你不需要用 class 或 new,只要对象带 next() 方法,并返回 { value, done } 就算合格。常见错误是忘记控制状态(比如 index 不递增),或在 done: true 后还试图返回 value(规范允许省略)。
-
next()必须无参或只接受一个参数(用于向生成器传值,普通迭代器一般不用) -
done为true表示彻底结束,之后所有调用都应返回{ done: true }(不能变回false) - 迭代器是一次性消耗品:一旦
done: true,再调用next()也只会重复返回结束态
const myIterator = {
values: [10, 20, 30],
index: 0,
next() {
if (this.index < this.values.length) {
return { value: this.values[this.index++], done: false };
}
return { done: true }; // 注意:这里不写 value 是合法且推荐的
}
};
console.log(myIterator.next()); // { value: 10, done: false }
console.log(myIterator.next()); // { value: 20, done: false }
console.log(myIterator.next()); // { value: 30, done: false }
console.log(myIterator.next()); // { done: true }
console.log(myIterator.next()); // { done: true } —— 已消耗,永远如此
function* 为什么比手写迭代器更常用?
因为 generator 函数自动满足迭代器协议:调用后返回的 Generator 对象,本身就是迭代器(有 next() 方法)。你只需专注“产出逻辑”,不用操心状态管理、边界判断、返回格式这些琐事。
-
yield是暂停点,每次next()都推进到下一个yield(或函数结束) - 函数体外控制执行节奏:适合异步流控、分页加载、惰性计算等场景
- 返回值类型是
Iterator,所以能直接用于for...of,无需额外包装
function* range(start, end, step = 1) {
for (let i = start; i < end; i += step) {
yield i;
}
}
const it = range(1, 5);
console.log(it.next()); // { value: 1, done: false }
console.log(it.next()); // { value: 2, done: false }
console.log([...it]); // [3, 4] —— 注意:it 已被部分消费,剩余值继续 yield
让普通对象支持 for...of?必须实现 [Symbol.iterator]
原生数组、Set、Map 能被 for...of 遍历,是因为它们内部实现了 [Symbol.iterator] 方法。你想让自定义对象也能这样,就得手动挂上这个方法——而 generator 函数正是最自然的实现方式。
技术上面应用了三层结构,AJAX框架,URL重写等基础的开发。并用了动软的代码生成器及数据访问类,加进了一些自己用到的小功能,算是整理了一些自己的操作类。系统设计上面说不出用什么模式,大体设计是后台分两级分类,设置好一级之后,再设置二级并选择栏目类型,如内容,列表,上传文件,新窗口等。这样就可以生成无限多个二级分类,也就是网站栏目。对于扩展性来说,如果有新的需求可以直接加一个栏目类型并新加功能操作
立即学习“Java免费学习笔记(深入)”;
- 该方法必须返回一个迭代器对象(即有
next()的对象) - 不能写成箭头函数(
this绑定会出错) - 如果返回的是 generator 实例,就自动满足协议,代码最简
const counter = {
from: 1,
to: 3,
*[Symbol.iterator]() {
for (let i = this.from; i <= this.to; i++) {
yield i;
}
}
};
for (const n of counter) {
console.log(n); // 1, 2, 3
}
真正容易被忽略的是:迭代器协议和可迭代协议是两层——next() 是迭代器协议,[Symbol.iterator] 是可迭代协议。generator 函数之所以强大,是因为它天然打通这两层:既产出迭代器,又可直接作为 [Symbol.iterator] 的返回值。别把 yield 当成“返回值”,它是“交出控制权”的信号;也别以为 next() 只是取数工具——它是整个异步/流式编程的底层节拍器。









