JavaScript如何实现迭代器_怎样自定义可遍历的数据结构_技术教程

JavaScript实现迭代器需对象拥有[Symbol.iterator]方法，返回含next()的对象，每次调用返回{value, done}；推荐用生成器函数（function*）实现，天然符合协议且支持多次遍历。

JavaScript 中实现迭代器的核心是让对象拥有 [Symbol.iterator] 方法，该方法必须返回一个符合迭代器协议的对象（即具有 next() 方法，每次调用返回 { value, done } 形式的对象）。自定义可遍历数据结构，本质上就是为这个对象正确实现该方法。

迭代器协议的基本要求

要被 for...of、扩展运算符（...）、解构赋值等语法识别为“可遍历”，对象必须满足：

拥有一个名为 Symbol.iterator 的方法（不能是箭头函数，需能访问内部状态）
该方法返回一个“迭代器对象”
迭代器对象必须有 next() 方法，每次调用返回形如 { value: any, done: boolean } 的对象
当 done 为 true 时，value 可选（通常表示遍历结束）

手写一个简单数组风格的迭代器

例如，为一个封装了数字列表的类添加遍历能力：

class NumberRange {
  constructor(start, end) {
    this.start = start;
    this.end = end;
  }
[Symbol.iterator]() {
let current = this.start;
return {
next: () => {
if (current <= this.end) {
return { value: current++, done: false };
} else {
return { value: undefined, done: true };
}
}
};
}
}
// 使用
for (const n of new NumberRange(2, 4)) {
console.log(n); // 2, 3, 4
}

用生成器函数简化实现（推荐）

生成器函数（function*）天然符合迭代器协议，内部自动维护状态，代码更简洁、不易出错：

class NumberRange {
  constructor(start, end) {
    this.start = start;
    this.end = end;
  }
*[Symbol.iterator]() {
for (let i = this.start; i <= this.end; i++) {
yield i;
}
}
}

生成器函数作为 [Symbol.iterator] 的实现，是目前最常用、最健壮的方式。它还能自然支持 break、return 和异常中断，且可多次遍历（每次调用都创建新迭代器）。

处理复杂数据结构（如树、图）

以二叉树为例，实现中序遍历迭代器：

class TreeNode {
  constructor(val, left = null, right = null) {
    this.val = val;
    this.left = left;
    this.right = right;
  }
[Symbol.iterator]() {
function traverse(node) {
if (!node) return;
yield traverse(node.left);
yield node.val;
yield traverse(node.right);
}
yield* traverse(this);
}
}
// 使用
const root = new TreeNode(1, 
new TreeNode(2), 
new TreeNode(3, new TreeNode(4))
);
console.log([...root]); // [2, 1, 4, 3]

关键点：递归生成器 + yield* 委托，让嵌套结构的遍历逻辑清晰可读。