es6中set和map的区别

在ES6(ECMAScript 2015)中,SetMap 是两种新的集合类型,它们提供了更高级的数据结构来存储唯一值或键值对集合。尽管它们在功能上有些相似,但它们在用途和内部机制上存在一些关键区别。

1. 基本概念

  • Set:一个集合(Set)是一种包含唯一值的数据结构。它的每个元素都是唯一的,没有重复的值。Set 类似于数组,但成员的值都是唯一的,没有重复的值。

  • Map:一个Map对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者原始值)都可以作为一个键或一个值。

2. 主要区别

2.1 存储的数据类型
  • Set:只存储唯一的值(无论是原始值还是对象引用)。
  • Map:存储键值对,键和值都可以是任何类型。
2.2 插入和访问
  • Set :通过 .add() 方法添加新元素,.has() 方法检查元素是否存在,.delete() 方法删除元素,.clear() 方法清空集合。没有直接按索引访问元素的方式,但可以遍历集合。
  • Map :通过 .set(key, value) 方法添加新的键值对,.get(key) 方法根据键获取值,.has(key) 方法检查键是否存在,.delete(key) 方法根据键删除键值对,.clear() 方法清空Map。
2.3 遍历
  • SetMap 都提供了遍历方法,如 .forEach().keys().values().entries()。但是,由于Map存储的是键值对,所以.entries() 方法对于Map特别有用,因为它返回一个包含每个键值对的数组。
2.4 顺序
  • SetMap 都保持了元素的插入顺序。这意味着,当你遍历它们时,元素将按照被添加到集合中的顺序返回。
2.5 默认值
  • Set 的默认值是 undefined(虽然你通常不会向Set中添加 undefined,因为它被视为唯一值)。
  • Map 的键和值都可以是 undefined,只要它们是唯一的或作为特定的键值对存在。

3. 应用场景

  • Set:适用于需要去重或者需要快速判断某个元素是否存在于集合中的场景。
  • Map:适用于需要存储键值对,并且需要保持键的插入顺序的场景,如实现字典、缓存等。

4. 示例

复制代码
// Set 示例  
let mySet = new Set();  
mySet.add(1);  
mySet.add(2);  
mySet.add(2); // 重复的值不会被添加  
console.log(mySet.has(2)); // true  
  
// Map 示例  
let myMap = new Map();  
myMap.set('a', 1);  
myMap.set('b', 2);  
console.log(myMap.get('a')); // 1  
console.log(myMap.has('b')); // true

总结,SetMap 在ES6中提供了强大的集合操作能力,它们的主要区别在于存储的数据类型(唯一值 vs 键值对)和相应的操作方法。选择使用哪一个取决于你的具体需求。

相关推荐
踩蚂蚁几秒前
在 ESP32 上跑自定义唤醒词:从 TFLite 到离线语音唤醒,一个下午搞定
前端
hunterandroid2 分钟前
Room 数据库迁移:让本地数据升级更稳
android·前端
徐小夕4 分钟前
倒腾2天,我开源了一款AI驱动的实时 3D CAD / 参数化建模工作台
前端·架构·github
少年白马醉春风丶9 分钟前
任务分解的经典范式 · 和 ReAct「走一步看一步」到底差在哪
前端
是烨笙啊9 分钟前
从 npm 与 Bun 的选择看 AI 时代的“最佳实践”焦虑
前端·人工智能·npm
lichenyang45312 分钟前
从 Web 容器到本地 HAR:我做了一个 HarmonyOS JSBridge 运行时框架 Demo
前端
超神熊猫15 分钟前
🧀🧀🧀前端仔如何快速上手python
前端·python
阿黎梨梨19 分钟前
AI 推理太慢用户要退钱?前端流式输出(Stream)究竟是何方神圣?
前端·vue.js
只一20 分钟前
从0到1吃透AI流式输出:Vue3+DeepSeek实战,解锁丝滑对话体验
前端·vue.js
JZC_xiaozhong25 分钟前
OA调价审批后,采购调价单如何自动同步到ERP?解决漏录错价难题
大数据·linux·服务器·前端·数据库·数据孤岛解决方案·数据集成与应用集成