当前位置：首页 > 文章列表 > 文章 > 前端 > JavaScript迭代器是什么？如何遍历自定义结构

JavaScript迭代器是什么？如何遍历自定义结构

2026-01-12 12:18:50 0浏览收藏

来到golang学习网的大家，相信都是编程学习爱好者，希望在这里学习文章相关编程知识。下面本篇文章就来带大家聊聊《JavaScript迭代器是什么？如何遍历自定义数据结构》，介绍一下，希望对大家的知识积累有所帮助，助力实战开发！

JavaScript迭代器是统一遍历机制，要求对象实现Symbol.iterator方法返回含next()的迭代器对象，next()返回{value, done}；手写Range类和BinaryTree树结构示例展示其应用，生成器函数是最简洁实现方式。

javascript迭代器是什么_如何遍历自定义的数据结构

JavaScript 迭代器是一种统一的遍历机制，它让任意数据结构只要满足特定协议（即实现 [Symbol.iterator]() 方法），就能被 for...of、扩展运算符（...）、解构赋值等语法自然消费。

迭代器的核心：Iterator 接口

一个对象要成为可迭代的，必须在其原型链上提供一个名为 Symbol.iterator 的方法，该方法返回一个**迭代器对象**。这个迭代器对象必须有 next() 方法，每次调用返回形如 { value: any, done: boolean } 的对象。

value：当前迭代出的值（可以是任意类型）
done：布尔值，true 表示遍历结束，false 表示还有值可取

手写一个简单迭代器

比如想让一个自定义的区间类 Range 支持 for...of：

class Range {
  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 Range(2, 5)) {
console.log(n); // 2, 3, 4, 5
}

为更复杂的数据结构添加迭代能力

例如树结构，常需支持多种遍历顺序（前序、中序、后序、层序）。可将不同策略封装为独立的迭代器方法：

class TreeNode {
  constructor(val, left = null, right = null) {
    this.val = val;
    this.left = left;
    this.right = right;
  }
}
class BinaryTree {
constructor(root) {
this.root = root;
}
[Symbol.iterator]() {
// 默认提供中序遍历（生成器写法更简洁）
function inorder(node) {
if (!node) return;
yield inorder(node.left);
yield node.val;
yield inorder(node.right);
}
yield* inorder(this.root);
}
// 额外提供前序遍历方法
preorder() {
function traverse(node) {
if (!node) return;
yield node.val;
yield traverse(node.left);
yield* traverse(node.right);
}
return traverse(this.root);
}
}
// 使用
const tree = new BinaryTree(
new TreeNode(1,
new TreeNode(2),
new TreeNode(3)
)
);
for (const val of tree) {
console.log(val); // 2, 1, 3 （中序）
}
for (const val of tree.preorder()) {
console.log(val); // 1, 2, 3 （前序）
}

注意：function* 生成器函数会自动返回符合迭代器协议的对象，是实现迭代器最常用、最简洁的方式。