es6学习——Set()

Set()

本身是构造函数,用来生成Set数据结构
const s = new Set();
Set 结构不会添加重复的值,去除数组重复成员的方法

Set 函数可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数

const set = new Set([1, 2, 3, 4, 4]);
[...set]
// [1, 2, 3, 4]

向 Set 加入值的时候,不会发生类型转换,类似于“===”,但区别在于,精确相等运算符认为NaN不等于自身
两个对象总是不相等的

Set 实例的属性

Set.prototype.constructor:构造函数,默认就是Set函数。
Set.prototype.size:返回Set实例的成员总数。

Set 实例的方法

add(value):添加某个值,返回 Set 结构本身。
delete(value):删除某个值,返回一个布尔值,表示删除是否成功。
has(value):返回一个布尔值,表示该值是否为Set的成员。
clear():清除所有成员,没有返回值。

Array.from方法可以将 Set 结构转为数组。

const items = new Set([1, 2, 3, 4, 5]);
const array = Array.from(items);

这就提供了去除数组重复成员的另一种方法。

function dedupe(array) {
  return Array.from(new Set(array));
}
dedupe([1, 1, 2, 3]) // [1, 2, 3]

遍历方法

(一)Set 结构的实例有四个遍历方法,可以用于遍历成员。

keys():返回键名的遍历器
values():返回键值的遍历器
entries():返回键值对的遍历器
forEach():使用回调函数遍历每个成员

由于 Set 结构没有键名,只有键值(或者说键名和键值是同一个值),所以keys方法和values方法的行为完全一致

Set 结构的实例默认可遍历,它的默认遍历器生成函数就是它的values方法。

Set.prototype[Symbol.iterator] === Set.prototype.values // true

这意味着,可以省略values方法,直接用for…of循环遍历 Set。

let set = new Set(['red', 'green', 'blue']);
for (let x of set) {
  console.log(x);
}
// red
// green
//blue

(二)forEach()

Set 结构的实例与数组一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值。

set = new Set([1, 4, 9]);
set.forEach((value, key) => console.log(key + ' : ' + value))
// 1 : 1
// 4 : 4
// 9 : 9

参数依次为键值、键名、集合本身

如果想在遍历操作中,同步改变原来的 Set 结构,目前没有直接的方法,但有两种变通方法。一种是利用原 Set 结构映射出一个新的结构,然后赋值给原来的 Set 结构;另一种是利用Array.from方法。

// 方法一
let set = new Set([1, 2, 3]);
set = new Set([...set].map(val => val * 2));
// set的值是2, 4, 6
// 方法二
let set = new Set([1, 2, 3]);
set = new Set(Array.from(set, val => val * 2));
// set的值是2, 4, 6

上面代码提供了两种方法,直接在遍历操作中改变原来的 Set 结构。

参考原文 阮一峰 ECMAScript 6入门

### ES6 Map 和 Set 的使用方法与差异 #### 使用方法 ##### 创建实例 对于 `Map`,可以通过调用带有可选初始条目列表的新建函数来创建其实例。这些条目通常表示为键值对数组的形式。 ```javascript const mapExample = new Map([ ['fruit', 'apple'], ['vegetable', 'carrot'] ]); ``` 而 `Set` 则用于存储唯一的值集合,无论是原始类型的还是对象引用: ```javascript const setExample = new Set(['red', 'green', 'blue']); ``` ##### 添加元素 向 `Map` 中添加新项可通过 `set()` 方法完成,此操作允许指定特定的键及其关联的数据[^3]。 ```javascript mapExample.set('grain', 'wheat'); console.log(mapExample.get('grain')); // 输出: wheat ``` 为了给 `Set` 增加成员,则利用其自身的 `add()` 函数即可实现这一点[^1]。 ```javascript setExample.add('yellow'); console.log([...setExample]); // 输出: Array ["red", "green", "blue", "yellow"] ``` ##### 遍历机制 两者都支持通过各自的 `forEach()` 进行遍历访问内部项目。值得注意的是,在处理 `Map` 时,回调函数接收三个参数——当前值、对应键以及整个映射本身;而在针对 `Set` 实施相同动作之际,仅需提供单个代表迭代器返回值得变量就足够了[^4]。 ```javascript // 对于 Map myMap.forEach((value, key, self) => { console.log(`${key}: ${value}`); }); // 对于 Set mySet.forEach(item => { console.log(item); }); ``` #### 差异分析 - **键类型灵活性**: `Map` 支持任何合法 JavaScript 数据类型作为键,包括但不限于字符串、数值乃至复杂对象等;相比之下,尽管 `Set` 同样能够容纳各种形式的对象,但它本质上并不区分不同种类之间的差别,因为这里关注的重点在于唯一性的保持而非键值关系的确立。 - **重复性控制**: 当涉及到防止冗余记录方面,`Set` 显得尤为突出,自动过滤掉那些已经存在的成分从而确保整体结构内不存在完全相同的实体;然而这并不是 `Map` 的核心功能之一,除非人为设定某些逻辑去达成相似效果,否则默认情况下不会主动去除重复出现过的键或值组合[^2]。 - **有序保障**: 如果应用程序依赖于插入顺序来进行后续的操作流程设计的话,那么显然基于 `Map` 构建起来的数据集更适合作为此种场景下的首选方案,因为它确实遵循着这样的原则保存新增入队列的信息片段;至于 `Set` 而言,默认行为未必能保证绝对意义上的先后次序不变特性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值