一维数组需迭代器模式以支持暂停恢复、结构扩展、行为组合及统一接口;核心是实现返回{value,done}的next()方法。

一维数组的遍历看似简单,但当业务逻辑变复杂、或需要与自定义数据结构保持统一访问方式时,直接用 for 或 forEach 就容易暴露细节、难以复用。迭代器模式不是“炫技”,而是把“怎么取下一个值”这件事标准化、可插拔、可组合。
为什么一维数组也需要迭代器模式
即使只是普通数组,以下场景也值得封装为迭代器:
- 需要中途暂停、恢复或多次重放遍历过程(比如分页加载、动画帧控制)
- 后续可能扩展为支持树、链表等其他结构,希望业务代码零修改
- 要叠加过滤、映射、限流等行为,且希望这些行为可复用、可组合
- 需兼容
for...of、...展开运算符,或与其他可迭代对象(如Map、Set)统一对接
手写一个标准迭代器对象
核心是实现 next() 方法,返回 { value, done } 结构:
function createArrayIterator(arr) {
let index = 0;
return {
next() {
if (index const iter = createArrayIterator([10, 20, 30]);
console.log(iter.next()); // { value: 10, done: false }
console.log(iter.next()); // { value: 20, done: false }
console.log(iter.next()); // { value: 30, done: false }
console.log(iter.next()); // { done: true }
让数组真正“可迭代”:挂载 Symbol.iterator
仅实现 next() 还不够——要让它被 for...of、Array.from、展开运算符识别,必须满足可迭代协议:
const myArray = [1, 2, 3];
myArray[Symbol.iterator] = function() {
let index = 0;
return {
next: () => {
return index // 现在可以这样用
for (const item of myArray) {
console.log(item); // 1, 2, 3
}
console.log([...myArray]); // [1, 2, 3]
用生成器函数简化迭代器创建
ES6 的 function* 天然返回符合协议的迭代器,写法更简洁、语义更清晰:
function* arrayIterator(arr) {
for (let i = 0; i const iter = arrayIterator(['a', 'b', 'c']);
console.log(iter.next()); // { value: 'a', done: false }
console.log(iter.next()); // { value: 'b', done: false }
console.log([...arrayIterator([1, 2, 3])]); // [1, 2, 3]
生成器还天然支持惰性求值——值只在调用 next() 时才计算,对大数据或无限序列很友好。











