JS 中 Map 的概念与使用

📚 JS 中 Map 的概念与使用

一、Map 是什么？

Map 是 ES6 新增的一种键值对集合。
与普通对象 {} 不同，Map 的键可以是任何类型（不仅限于字符串或符号）。
保持插入顺序，即按照添加顺序进行迭代。

✅ 特点总结：

键可以是任意数据类型
有序存储
更快的查找性能
常用方法丰富

二、Map 的基本用法

1. 创建 Map

js 复制代码

const map = new Map();

也可以直接初始化：

js 复制代码

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

2. 常用方法

方法	作用	示例
`set(key, value)`	添加或更新键值对	`map.set('color', 'blue')`
`get(key)`	根据 key 获取对应的 value	`map.get('color') // 'blue'`
`has(key)`	判断是否存在某个 key	`map.has('color') // true`
`delete(key)`	删除指定 key	`map.delete('color')`
`clear()`	清空所有键值对	`map.clear()`
`size`	返回 Map 中元素数量	`map.size`

3. 遍历 Map

js 复制代码

const map = new Map([
  ['a', 1],
  ['b', 2],
  ['c', 3],
]);

// 遍历 key
for (let key of map.keys()) {
  console.log(key);
}

// 遍历 value
for (let value of map.values()) {
  console.log(value);
}

// 遍历 [key, value]
for (let [key, value] of map.entries()) {
  console.log(key, value);
}

// 或直接用 forEach
map.forEach((value, key) => {
  console.log(key, value);
});

三、Map 和 Object 的区别

对比点	Map	Object
键的数据类型	任意类型	字符串或 Symbol
键值对的顺序	有序	无序（部分浏览器顺序不保证）
性能	大量增删操作更优	小量数据简单使用
自带方法	丰富（size, set, get, delete）	基本只有原型链方法

简单理解：

少量简单数据，选 Object
需要复杂操作、顺序、任意类型 key，选 Map

四、常见场景举例

1. 统计元素出现次数

js 复制代码

function countElements(arr) {
  const map = new Map();
  for (const item of arr) {
    map.set(item, (map.get(item) || 0) + 1);
  }
  return map;
}

console.log(countElements(['a', 'b', 'a', 'c', 'b', 'a']));

2. 两数之和题（LeetCode）

js 复制代码

function twoSum(nums, target) {
  const map = new Map();
  for (let i = 0; i < nums.length; i++) {
    const complement = target - nums[i];
    if (map.has(complement)) {
      return [map.get(complement), i];
    }
    map.set(nums[i], i);
  }
}

✅ 小总结

Map 是一种更灵活、功能更强的键值对集合
键可以是任意类型，且元素有序
适合频繁增删查操作、复杂数据结构场景