ES6,JS 字典集合去重

本文介绍了一种使用JavaScript的reduce方法来从数据集中去除重复商铺ID的方法,确保每个商铺ID只被保留一条记录。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

this.tablelist1 = res.data.data.reduce(
							(item, next) => {
								if (!item.find(v => v.lngShopID == next.lngShopID)) {
									item.push(next);
								}
								return item;
							}, []);

同一个shopid只取第一条.

<think>嗯,用户想了解ES6中Set和Map的用法及区别。首先,我需要回忆一下ES6中这两个数据结构的特性。记得Set类似于数组,但成员唯一,没有复值。而Map类似于对象,但键可以是任意类型。不过具体的区别和使用方法可能需要详细整理。 先看Set,用户可能想知道如何创建Set实例,比如用new Set(),然后通过add方法添加元素。还要提到Set的属性,比如size,以及方法如delete、has、clear等。另外,Set的遍历方法,比如keys、values、entries,还有forEach,这些都需要解释清楚。不过因为Set没有键名,所以keys和values返回的可能一样?或者需要说明这一点。 然后是Map,用户可能关心Map和普通对象的区别,特别是键的类型。比如Map的键可以是对象、函数等,而对象的键只能是字符串或者Symbol。要提到Map的set和get方法,链式操作,比如连续set。另外,Map的size属性,以及同样有has、delete、clear等方法。遍历方法部分,Map的entries可能返回键值对,而forEach也可以遍历。可能需要提到Map在存储键值对时的优势,比如频繁增删键值对的场景。 接下来是区别部分。结构上,Set是集合,存储唯一值;Map是字典,存储键值对。数据形式不同,Set的值直接存储,而Map是键值对。另外,键的类型差异,Set自动,而Map的键可以是任意类型。应用场景方面,Set用于数据集合运算,Map适合需要复杂键的情况,比如关联数据。 还要注意引用中的内容,比如Map的键是跟内存地址绑定的,这样可以避免同名属性碰撞的问题。比如如果键是对象,不同的对象实例即使内容相同也被视为不同的键。这点需要强调,可能用户会混淆为什么两个看起来一样的对象作为键会被当作不同的键。 使用方法部分,需要给出示例代码,比如如何创建Set,添加元素,检查存在,删除元素。同样,Map的创建,设置键值,获取值,链式调用等。可能还要提到初始化时传入数组或迭代器的方式,比如new Set([1,2,3])或者new Map([[key, value], ...])。 用户可能还会混淆Set和Map的遍历方法,比如Set的keys和values方法是否相同,而Map的遍历会得到键值对。需要明确说明这些细节。 最后,应用场景部分,需要举例说明,比如用Set来做数组,或者记录唯一用户ID;用Map来存储对象相关的元数据,或者作为缓存。可能还需要提到WeakSet和WeakMap,但用户问题中没有提到,可能暂时不需要深入,除非有必要。 总结一下,回答的结构应该是先分别介绍Set和Map的用法,包括创建、属性、方法、遍历,然后对比它们的区别,最后说明应用场景。需要确保使用正确的中文术语,并且代码示例符合格式要求,用$...$包裹行内代码,独立代码块用```。同时注意引用来源,比如引用[^1]到[^4]中的内容,特别是关于键绑定内存地址的部分,需要正确标注引用。</think>### ES6中Set和Map的用法及区别 #### 一、Set的用法 1. **定义与特性** Set是一种**唯一值无序集合**,成员不可复。例如: ```javascript const set = new Set([1, 2, 3, 3]); // 自动,结果为{1, 2, 3} ``` 2. **核心方法** - `add(value)`:添加值,返回Set本身(支持链式调用) - `has(value)`:检查值是否存在 - `delete(value)`:删除值 - `size`属性:获取元素数量 ```javascript let s = new Set(); s.add(1).add(2).add(3); s.has(2); // true s.delete(1); ``` 3. **遍历操作** Set提供`keys()`、`values()`、`entries()`和`forEach()`方法。由于Set没有键名,`keys()`与`values()`行为一致: ```javascript s.forEach((value) => console.log(value)); // 输出2, 3 ``` #### 二、Map的用法 1. **定义与特性** Map是**键值对集合**,键可为任意类型(包括对象),解决了传统对象键类型受限的问题[^1]。例如: ```javascript const map = new Map(); const keyObj = {}; map.set(keyObj, 'value'); // 键为对象 ``` 2. **核心方法** - `set(key, value)`:设置键值对(支持链式调用) - `get(key)`:获取值 - `has(key)`:检查键是否存在 - `size`属性:获取键值对数量 ```javascript let m = new Map(); m.set('name', 'Alice').set('age', 25); m.get('name'); // 'Alice' ``` 3. **遍历操作** 与Set类似,但遍历结果以`[key, value]`数组形式返回: ```javascript m.forEach((value, key) => console.log(`${key}: ${value}`)); ``` #### 三、Set与Map的区别 | 特性 | Set | Map | |---------------------|------------------------|------------------------| | **数据结构** | 唯一值的集合 | 键值对集合 | | **键/值类型** | 值即键,无单独键 | 键可为任意类型 | | **机制** | 自动 | 键唯一,值可复 | | **典型应用场景** | 数组集合运算 | 复杂键关联数据、缓存 | #### 四、应用场景 1. **Set的典型用途** - 数组:`[...new Set(array)]` - 记录用户唯一访问ID: ```javascript const userIds = new Set(); userIds.add(1001).add(1002); ``` 2. **Map的典型用途** - 存储对象元数据(避免污染对象自身属性): ```javascript const metadata = new Map(); metadata.set(document.getElementById('app'), { loaded: true }); ``` - 替代普通对象实现高效键值存储[^3]。 #### 五、关键区别示例 ```javascript // Set的键即值 const s = new Set(); s.add(5); // 键和值均为5 // Map支持对象作为键 const m = new Map(); const objKey = {}; m.set(objKey, 'data'); m.get(objKey); // 'data' ``` Map的键通过内存地址绑定,即使内容相同的不同对象也会被视为不同键[^3]。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值