你真的了解 Map、Set 嘛

大家好，我是 彭于晏 （手动狗头 🐶），今天不聊这那得，来聊聊很多人用得不够透彻的 Map 和 Set。它们在前端开发里经常被拿来当"哈希表"和"集合"使用，但你真的搞懂了吗？

🔑 1. Map ------ 特殊的"键值对集合"

很多同学第一反应：Map 不就是个对象吗？

没错，Map 可以理解为进化版的对象 。它存储的是 键值对 (key → value) ，和普通对象 {} 相比有以下区别：

特性	普通对象 `{}`	Map
键的类型	字符串 / Symbol	任意类型（对象、数组、函数、数字...）
键值对顺序	无保证（现代实现一般保持插入顺序）	严格保持插入顺序
遍历方式	`for...in` / `Object.keys`	`map.forEach`、`for...of`
大小统计	`Object.keys(obj).length`	直接 `map.size`
原型链干扰	有可能（比如 `toString`）	不会

📌 示例

c 复制代码

const map = new Map();
map.set("a", 1);       // 字符串键
map.set(1, "one");     // 数字键
map.set({x: 10}, "obj"); // 对象键

console.log(map);
// Map(3) {"a" => 1, 1 => "one", {x: 10} => "obj"}

键唯一：同一个键只保留最后一次设置的值。
值不唯一：不同键可以对应相同的值。

c 复制代码

map.set("x", 100);
map.set("y", 100); // 值可以重复

🔑 2. Set ------ 特殊的"值集合"

如果说 Map 是"升级版对象"，那 Set 就是"升级版数组"。

它只存值，不存键，并且这些值唯一，不会重复。

📌 示例

csharp 复制代码

const set = new Set();
set.add(1);
set.add(2);
set.add(2); // 自动去重
set.add("hello");

console.log(set); // Set(3) {1, 2, "hello"}

值唯一：同一个值不会重复存储。
没有键 ：底层可以理解成 value => value 的映射。

👉 在 JS 规范里，Set 的确是 [[key, key]] 的形式存储。

🔑 3. 如何理解？

普通对象 {} ：最基本的键值存储，键只能是字符串或 Symbol。
Map：
- "进化版对象"，更适合当字典/哈希表使用
- 键可以是任意类型
- 顺序有保证，API 更丰富
Set：
- "只存键的 Map"
- 本质上是特殊的键集合（键和值相同）
- 专注于存储唯一值

🔧 4. 实战：两数之和（两数之差）

暴力解法 O(n²)

ini 复制代码

function twoSum(nums, target) {
  for (let i = 0; i < nums.length; i++) {
    for (let j = i + 1; j < nums.length; j++) {
      if (nums[i] + nums[j] === target) {
        return [i, j];
      }
    }
  }
  return [];
}

console.log(twoSum([2, 7, 11, 15], 9)); // [0,1]

Map 解法 O(n)

ini 复制代码

function twoSum(nums, target) {
  const map = new Map(); // 用 Map 做哈希表
  for (let i = 0; i < nums.length; i++) {
    const need = target - nums[i];
    if (map.has(need)) {
      return [map.get(need), i];
    }
    map.set(nums[i], i);
  }
  return [];
}

console.log(twoSum([2, 11, 7, 15], 9)); // [1,2]

Set 应用：数组去重

ini 复制代码

const arr = [1, 2, 2, 3, 4, 4, 5];
const unique = [...new Set(arr)];
console.log(unique); // [1,2,3,4,5]

📚 5. 总结

Map 👉 特殊的 键值对集合（键唯一，值可重复，键可为任意类型）。
Set 👉 特殊的 值集合 （值唯一，本质上类似 Map 的 key === value 版本）。
Map 用来做字典/哈希表，Set 用来做去重/集合运算，它们都是前端开发常用的利器。

💡 下次写代码时，别再用对象凑合了，合理使用 Map 和 Set，代码会更优雅更高效。

👋 我是彭于晏，我们多多使用升级版对象和升级版数组，让我们得对象越来越美丽，让我们得漂亮对象数组越来越多，不重复。爱生活，爱升级版对象和数组。