JavaScript迭代器详解与遍历方式

JavaScript迭代器是一种统一、标准化的遍历机制，让数组、Map、Set、字符串等不同数据结构都能通过相同的接口（`next()`方法返回`{value, done}`对象）被逐个访问；它不仅支持手动实现（如自定义`Symbol.iterator`），更可通过简洁优雅的生成器函数（`function*` + `yield`）轻松创建复杂迭代逻辑，配合`for...of`、扩展运算符、解构赋值等语法，极大提升了代码的可读性与复用性——掌握迭代器，就是掌握了现代JavaScript高效处理数据流的核心能力。

JavaScript 迭代器（Iterator）是一种统一的遍历接口，它让不同数据结构（如数组、Map、Set、字符串等）能用相同方式被逐个访问元素。核心是实现 next() 方法，返回形如 { value: 当前值, done: 是否结束 } 的对象。

迭代器的基本结构和手动创建

一个对象只要拥有符合规范的 Symbol.iterator 方法，并返回一个带有 next() 方法的对象，就是可迭代的。你可以手动构造一个简单迭代器：

• 定义一个函数，内部维护索引和数据源
• 返回对象，其 [Symbol.iterator]() 返回一个对象
• 该对象的 next() 每次调用返回下一个 {value, done}

例如，为普通数组封装一个只返回偶数索引元素的迭代器：

哪些内置类型默认支持迭代？

以下类型原生具备 Symbol.iterator，可直接用于 for...of、扩展运算符（...）、解构等：

• Array：按索引顺序遍历元素
• String：按 Unicode 码点（非字节）遍历字符
• Map：遍历 [key, value] 数组（保持插入顺序）
• Set：遍历唯一值（保持插入顺序）
• TypedArray（如 Uint8Array）：遍历数值元素
• arguments 对象 和 NodeList（DOM 集合）在现代环境中也支持

如何实际遍历？常用语法和注意事项

有了迭代器，你不需要手动调用 next()，JavaScript 提供了更简洁的消费方式：

• for...of 循环：最常用，自动调用迭代器并处理 done
• 扩展运算符 ...：如 [...mySet] 转成数组
• 解构赋值：如 const [a, b] = new Set([1,2])
• Array.from()：可转换任意可迭代对象为数组，支持映射回调

注意：Object 默认不可迭代。想遍历对象属性，需用 Object.keys(obj)、Object.entries(obj) 等先转成数组，或手动添加 Symbol.iterator。

生成器函数：更优雅的迭代器写法

function* 声明的生成器函数会自动返回一个迭代器对象，用 yield 暂停并产出值，极大简化复杂迭代逻辑：

生成器还能配合 yield* 委托其他可迭代对象，适合组合多个数据源。

终于介绍完啦！小伙伴们，这篇关于《JavaScript迭代器详解与遍历方式》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！