迭代器是JavaScript中通过next()方法访问集合元素的设计模式，返回包含value和done的对象；for循环适用于索引操作，for…of遍历可迭代对象的值，forEach执行回调但不可中断，map生成新数组，for…in用于对象属性遍历，Object.keys结合forEach可枚举自身属性；实现Symbol.iterator可使对象可迭代，内置可迭代类型包括Array、String、Map、Set等，支持for…of和扩展运算符。
JavaScript 中的迭代器和遍历方法是处理数据集合的核心机制。理解它们能帮助你更高效地操作数组、对象和其他可迭代结构。
什么是迭代器（Iterator）
迭代器是一种设计模式，允许你访问集合中的元素而无需暴露其底层结构。在 JavaScript 中，一个迭代器是一个对象，它实现了 next() 方法，返回包含 value 和 done 两个属性的对象。
当 done 为 true 时，表示遍历结束；否则继续通过 value 获取当前值。
你可以手动创建一个迭代器：
立即学习“Java免费学习笔记（深入）”；
const arr = [1, 2, 3];const iterator = arr[Symbol.iterator]();iterator.next(); // { value: 1, done: false }iterator.next(); // { value: 2, done: false }iterator.next(); // { value: 3, done: false }iterator.next(); // { value: undefined, done: true }
常见的遍历方法
JavaScript 提供了多种方式来遍历数组或类数组结构，每种方法适用不同场景。
1. for 循环 — 最基础的方式，适合需要索引的操作。
for (let i = 0; i < arr.length; i++) { console.log(arr[i]);}
2. for…of 循环 — 遍历可迭代对象（如数组、字符串、Map、Set），直接获取值。
for (const item of arr) { console.log(item);}
3. forEach() — 数组方法，执行回调函数对每个元素进行操作，不能中断（return 不会跳出循环）。
arr.forEach(item => { console.log(item);});
4. map() — 创建一个新数组，结果是原数组每个元素调用函数后的返回值。
const doubled = arr.map(x => x * 2);
5. for…in — 主要用于遍历对象的可枚举属性，不推荐用于数组（因为可能遍历到意外的属性）。
const obj = { a: 1, b: 2 };for (const key in obj) { console.log(key, obj[key]);}
6. Object.keys() + forEach — 遍历对象的所有自身可枚举属性键。
Object.keys(obj).forEach(key => { console.log(key, obj[key]);});
可迭代协议与自定义对象遍历
任何对象只要实现 [Symbol.iterator] 方法，就可以被 for…of 或扩展运算符使用。
例如，让一个普通对象支持遍历：
const myIterable = { data: ['a', 'b', 'c'], [Symbol.iterator]() { let index = 0; return { next: () => { if (index < this.data.length) { return { value: this.data[index++], done: false }; } return { done: true }; } }; }};for (const item of myIterable) {console.log(item); // 输出 a, b, c}
哪些类型默认可迭代？
以下内置类型实现了可迭代协议：
ArrayStringMapSetarguments 对象NodeList 等 DOM 集合（部分环境）
这意味着它们都能用 for…of、… 扩展、Array.from() 等方式处理。
基本上就这些。掌握迭代器原理和各种遍历方法的区别，能让你写出更清晰、高效的代码。
以上就是JavaScript迭代器_javascript遍历方法的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1540072.html
微信扫一扫 
支付宝扫一扫 
![Go语言接口与切片：如何识别和操作[]interface{}](https://cdn.chuangxiangniao.com/www/2025/12/176369856569294-1.jpg?imageMogr2/crop/480x300/gravity/center)
