JavaScript Map 对象的遍历方法全解析 🗺️

Map 是 ES6 引入的新的数据结构，它类似于对象，但是"键"的范围不限于字符串，各种类型的值（包括对象）都可以当作键。本文将详细介绍 Map 的各种遍历方法。

1. forEach 遍历 🔄

最常用的遍历方法，通过回调函数遍历所有的键值对：

const map = new Map([
  ['name', '张三'],
  ['age', 25],
  ['job', '程序员']
]);

map.forEach((value, key, map) => {
  console.log(`${key} = ${value}`);
  // 输出:
  // name = 张三
  // age = 25
  // job = 程序员
});

⚠️ 注意事项：

• forEach 的回调函数参数顺序是 (value, key, map)，这与数组的 forEach 不同
• 回调函数中的 this 可以通过 forEach 的第二个参数指定

2. for...of 遍历 🔁

for...of 是最灵活的遍历方式，提供了多种遍历选项：

const map = new Map([
  ['name', '张三'],
  ['age', 25]
]);

// 1. 遍历键值对
for (const [key, value] of map) {
  console.log(`${key} = ${value}`);
}

// 2. 只遍历键
for (const key of map.keys()) {
  console.log(key);
}

// 3. 只遍历值
for (const value of map.values()) {
  console.log(value);
}

3. entries() 遍历 📝

entries() 方法返回一个新的迭代器对象，包含 Map 对象中所有的键值对：

const map = new Map([
  ['name', '张三'],
  ['age', 25]
]);

for (const [key, value] of map.entries()) {
  console.log(`${key} = ${value}`);
}

4. 实用技巧 💡

转换为数组

const map = new Map([
  ['name', '张三'],
  ['age', 25]
]);

// 转换为键值对数组
const entries = [...map];  // 或 Array.from(map)
console.log(entries); // [['name', '张三'], ['age', 25]]

// 获取所有键
const keys = [...map.keys()];

// 获取所有值
const values = [...map.values()];

Map 与对象的转换

// 对象转 Map
const obj = { name: '张三', age: 25 };
const map = new Map(Object.entries(obj));

// Map 转对象
const objFromMap = Object.fromEntries(map);

性能考虑 ⚡

• forEach 方法在大多数情况下性能较好，是最常用的遍历方式
• for...of 循环可以通过 break 随时终止遍历，更加灵活
• 如果需要同时访问键和值，直接使用 for...of map 是最简洁的方式

最佳实践 ✨

1. 需要遍历并执行操作，使用 forEach
2. 需要中断遍历或更灵活的控制，使用 for...of
3. 需要转换数据结构，考虑使用 entries()
4. 只需要键或值，使用 keys() 或 values() 方法

希望这篇文章能帮助你更好地理解和使用 Map 的遍历方法！🎉