javascript中map的foreach()和for...of遍历方式核心区别在于：foreach是原生方法，参数顺序为value/key/map，不支持break；for...of是语法结构，支持解构、break/continue、异步操作，更灵活通用。
JavaScript 中的 Map 对象支持多种遍历方式，forEach() 和 for...of 是最常用、最直观的两种。它们都能访问键值对，但语法和适用场景略有不同。
用 forEach 遍历 Map
forEach() 是 Map 原生方法，接收一个回调函数，按插入顺序依次执行。回调函数参数依次为：值、键、Map 本身（注意：和数组的 forEach 不同，Map 的第一个参数是 value，第二个才是 key）。
示例：
JavaStoryDevelop
下载
你接手一个需求时，是不是经常这样："改一个小字段 → 结果把不相关的代码也改了"、"需求说得很模糊 → 做着做着发现跑偏了"、"数据库加个字段 → 上线才发现漏了数据兼容"、"做了个新功能 → 一个月后自己都忘了当时怎么设计的"、"写到一半被中断 → 再回来不知道从哪继续"；这个 Skill 就是专门解决这些问题的。 它会自动探测你的项目环境（JDK、Spring Boot、ORM、数据库、前端框架），记在
const map = new Map([['a', 1], ['b', 2], ['c', 3]]);
map.forEach((value, key, mapObj) => {
console.log(`${key} → ${value}`); // a → 1, b → 2, c → 3
});
- 不能用
break或return false中断循环（想提前退出需改用for...of或手动抛错） - 适合简单遍历、副作用操作（如打印、存入其他结构、触发事件）
- 不返回新结构，也不改变原 Map
用 for...of 遍历 Map
Map 是可迭代对象，默认迭代器返回的是 [key, value] 数组。因此 for...of 直接遍历得到的就是键值对数组，可用解构语法清晰获取。
示例：
const map = new Map([['x', 10], ['y', 20]]);
for (const [key, value] of map) {
console.log(`${key}: ${value}`); // x: 10, y: 20
}
- 支持
break、continue、return（在函数内），控制更灵活 - 可结合解构、条件判断、异步操作（如
await）使用 - 若只需键或值，也可单独遍历：
map.keys()、map.values()、map.entries()（for...of map等价于for...of map.entries()）
forEach 和 for...of 的关键区别
-
forEach是方法调用，for...of是语言级语法，后者更通用（可用于 Set、Array、自定义迭代器等） -
forEach回调中this默认为undefined（严格模式），如需绑定上下文需传第二个参数；for...of无此问题 -
for...of可与扩展运算符配合：[...map]得到二维数组，[...map.keys()]得到键数组 - 性能上差异极小，日常开发无需过度优化，按可读性和控制需求选择即可
实际小技巧
- 想把 Map 转成普通对象？用
Object.fromEntries(map)（ES2019+） - 遍历时过滤？
for...of内加if判断比嵌套forEach更清晰 - 需要索引？
for (const [key, value] of [...map.entries()].entries())，但通常 Map 不强调索引，应优先考虑语义是否合理
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
