set

Set本身是一个构造函数,用来生成 Set 数据结构。可以接受一个数组(或者具有 iterable 接口的其他数据结构)作为参数,用来初始化。

  1. // 例一
  2. const set = new Set([1, 2, 3, 4, 4]);
  3. [...set]
  4. // [1, 2, 3, 4]
  5. set.size //4
  6. // 例二
  7. const set = new Set(document.querySelectorAll('div'));
  8. set.size // 56
  9. // 类似于
  10. const set = new Set();
  11. document.querySelectorAll('div').forEach(div => set.add(div));
  12. set.size // 56

ps:向 Set 加入值的时候,不会发生类型转换,所以5"5"是两个不同的值。在 Set 内部,NaN等于自身。

Set 实例的方法分为两大类:

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

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

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

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

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

遍历数据的方法
  • Set.prototype.keys():返回键名的遍历器
  • Set.prototype.values():返回键值的遍历器
  • Set.prototype.entries():返回键值对的遍历器
  • Set.prototype.forEach():使用回调函数遍历每个成员
  1. let set = new Set(['red', 'green', 'blue']);
  2. for (let item of set.keys()) {
  3. console.log(item);
  4. }
  5. // red
  6. // green
  7. // blue
  8. for (let item of set.entries()) {
  9. console.log(item);
  10. }
  11. // ["red", "red"]
  12. // ["green", "green"]
  13. // ["blue", "blue"]
  14. let set = new Set([1, 4, 9]);
  15. set.forEach((value, key) => console.log(key + ' : ' + value))
  16. // 1 : 1
  17. // 4 : 4
  18. // 9 : 9

WeakSet

WeakSet 结构与 Set 类似,也是不重复的值的集合。但是,它与 Set 有两个区别。

首先,WeakSet 的成员只能是对象,而不能是其他类型的值。

其次,WeakSet 中的对象都是弱引用,即垃圾回收机制不考虑 WeakSet 对该对象的引用,也就是说,如果其他对象都不再引用该对象,那么垃圾回收机制会自动回收该对象所占用的内存,不考虑该对象还存在于 WeakSet 之中。

WeakSet 的一个用处,是储存 DOM 节点,而不用担心这些节点从文档移除时,会引发内存泄漏。

Map

它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。

Map 也可以接受一个数组作为参数。该数组的成员是一个个表示键值对的数组。

  1. const map = new Map([
  2. ['name', '张三'],
  3. ['title', 'Author']
  4. ]);
  5. map.size // 2
  6. map.has('name') // true
  7. map.get('name') // "张三"
  8. map.has('title') // true
  9. map.get('title') // "Author"
  • 如果对同一个键多次赋值,后面的值将覆盖前面的值。
  • 如果读取一个未知的键,则返回undefined
  • 只有对同一个对象的引用,Map 结构才将其视为同一个键。

操作数据和遍历数据的方法与set类似

map与其他数据结构的互相转换 §

WeakMap

WeakMapMap的区别有两点。

首先,WeakMap只接受对象作为键名(null除外),不接受其他类型的值作为键名。

其次,WeakMap的键名所指向的对象,不计入垃圾回收机制。WeakMap结构有助于防止内存泄漏。

WeakMap使用场景

如果你要往对象上添加数据,又不想干扰垃圾回收机制,就可以使用 WeakMap。一个典型应用场景是,在网页的 DOM 元素上添加数据,就可以使用WeakMap结构。当该 DOM 元素被清除,其所对应的WeakMap记录就会自动被移除。

注意,WeakMap 弱引用的只是键名,而不是键值。键值依然是正常引用。

  1. const wm = new WeakMap();
  2. let key = {};
  3. let obj = {foo: 1};
  4. wm.set(key, obj);
  5. obj = null;
  6. wm.get(key)
  7. // Object {foo: 1}

上面代码中,键值obj是正常引用。所以,即使在 WeakMap 外部消除了obj的引用,WeakMap 内部的引用依然存在。