likes
comments
collection
share

ES6中Set和Map

作者站长头像
站长
· 阅读数 21

Set

Set在js中是使用'{}'进行表示的(size代表这个数据的数据长度):

ES6中Set和Map

我们在里面加入值的话呢,得到的是这样一个数据结构:

ES6中Set和Map

跟对象很像,但是只有值没有key,不是key:value的形式;

跟数组又很相似,只是是用‘{}’表示的。这种跟数组相似的数据结构我们称为类数组。

特点

  • 成员唯一,无重复项

  • 不能取到具体的某一个值,但是可以判断是否含有某个值(has()

常用方法

  • delete(value) : 删除 Set 中指定的值。

ES6中Set和Map

  • add(value) : 添加一个值到 Set 中。如果值已存在,则不会添加。

ES6中Set和Map

  • has(value) : 检查 Set 中是否包含指定的值。

ES6中Set和Map

  • clear() : 清空 Set 中的所有值。

ES6中Set和Map

  • size: 获取 Set 中的元素个数。

ES6中Set和Map

  • keys() : 返回一个包含所有值的迭代器(与 values() 方法相同)。

  • values() : 返回一个包含所有值的迭代器。

  • entries() : 返回一个包含所有 [value, value] 键值对的迭代器。

ES6中Set和Map

由于Set的元素不可重复性,我们可以利用这一点来进行数组去重的操作

Set除了可以接收数组还能接收别的数据类型,但是这个数据类型必须具有迭代器iterable属性(即可以被遍历)

数组去重

好了,现在我们已经知道Set是可以帮我们给一个数组去重,Set可以直接接收一个数组,那去重之后怎么转回数组呢?

可以采用解构

const arr = [1, 2, 3, 4, 4, 3, 2, 1]
//去除重复项
const arr2 = [...new Set(arr)]//解构
console.log(arr2);

ES6中Set和Map

字符串去重

由于字符串也是具有迭代器iterable属性的,可以被遍历,所以也可以直接把字符串传进Set中。

转回字符串我们可以通过添加空字符串的方法实现。

const str = 'abcabc'
console.log([...new Set(str)].join(''));

ps.

{a:1}+''不是变成'{a:1}'而是变成'[object Object]'

JavaScript 会尝试调用对象的 toString 方法来将其转换为字符串。如果对象没有定义 toString 方法,则会使用 Object.prototype.toString 方法,这通常返回的是 [object Object]

遍历

for-of

我们可以使用for-of来进行遍历,for-of是专门用来遍历具有iterable属性结构的方法。

const s = new Set([1, 2, 3, 3])
for (const item of s.entries()) {
 console.log(item);
 }

ES6中Set和Map

forEach

在es6之前,只有数组可以用forEach方法,但今时不同往日,Set也能用forEach进行遍历了

s.forEach((val, key) => {
  console.log(val, key);//得到键名和键值
})

WeakSet

WeakSet 的成员只能是对象和 Symbol 值

  • 弱引用
  1. 一个对象存放在了其他结构中,当后续存在其他对象引用这个对象,那么这个对象的内存就不会被回收.

  2. 一个对象obj存在了其它结构当中,当后续只存在WeakSet对它的引用,该对象的内存依然会被回收.

WeakSet 的成员是不适合引用的,因为它会随时消失

只能存储对象:WeakSet中的元素必须是对象,不能存储原始数据类型(如数字、字符串等)。

弱引用:WeakSet对存储的对象是弱引用,即使对象存在于WeakSet中,如果在其他地方没有被引用,它仍然可以被垃圾回收器回收。

无法迭代:由于弱引用的特性,WeakSet没有提供像Set那样的迭代方法,例如forEach、keys、values和entries。

不可遍历:WeakSet没有size属性和clear方法,也不能使用for...of循环进行遍历

示例

const weakSet = new WeakSet(); 
const obj = {}; weakSet.add(obj); 
console.log(weakSet.has(obj)); // true 
weakSet.delete(obj); 
console.log(weakSet.has(obj)); // false

ES6中Set和Map

Map

在之前,对象中的key只能是字符串,但是随着需求的发展,我们想用别的数据诶新当做key咋办呢,Map就来了,Map可以使用任意数据类型作key。

Map 是一种数据结构(不是数组上的那个map遍历方法),允许使用任何类型的值作为键(包括对象和函数),并且维护键值对的顺序。

特点

  • 键值对: Map 存储的是键值对,每个键只能出现一次。
  • 按插入顺序遍历: Map 保持键值对的插入顺序。

常用方法

  • set(key, value) : 添加或更新键值对。(不是上文的那个数据结构Set)
  • get(key) : 获取指定键的值。
  • delete(key) : 删除指定键及其对应的值。
  • has(key) : 检查 Map 中是否包含指定的键。
  • clear() : 清空 Map 中的所有键值对。
  • size: 获取 Map 中的键值对个数。
  • keys() : 返回一个包含所有键的迭代器。
  • values() : 返回一个包含所有值的迭代器。
  • entries() : 返回一个包含所有 [key, value] 键值对的迭代器。

示例

const map = new Map();
map.set('name', 'Alice');
map.set('age', 25);
console.log(map.get('name')); // Alice
console.log(map.size); // 2
map.delete('age');
console.log(map.size); // 1

ES6中Set和Map

WeakMap

WeakMap 是一种类似于 Map 的数据结构,但其键是弱引用的。以下是一些主要特点:

  • 只能使用对象作为键: WeakMap 的键必须是对象(包括 Symbol),不能是原始数据类型。
  • 弱引用: 对存储在 WeakMap 中的键进行弱引用,如果没有其他地方引用该对象,它可以被垃圾回收器回收。
  • 不可迭代: WeakMap 没有迭代器方法,也无法获取其元素的数量。

示例

const weakMap = new WeakMap();
const obj = {};
weakMap.set(obj, 'value');
console.log(weakMap.get(obj)); // value
weakMap.delete(obj);
console.log(weakMap.get(obj)); // undefined

ES6中Set和Map

这些数据结构提供了灵活的方式来处理和存储数据,根据需要选择适合的结构能够提高代码的性能和可维护性。

转载自:https://juejin.cn/post/7397608098213412899
评论
请登录