ES6之Set

发表于 | 分类于

在ES6中，提供了新的数据结构set，set类似于数组，但是其中的元素是不能重复的。我们先来看个例子：

初始化

1
2
3
4
5
let set = new Set();
[1,2,2,3,4,5,5,5].map(x => set.add(x));
console.log(set.size); //5

初始化也可以接受数组为入参

1
let set = new Set([1,2,3,4]);

刚才讲到，set中所有的元素是不能重复的，那么，怎么定义重复呢？set使用的方法类似于 ===，只有一个特例，NaN, 精确相等任务NaN不等于自身，而set中认为是相等的。

看几个例子，就一目了然了：

1
2
3
4
5
6
7
8
9
10
11
12
13
let set = new Set(["a", "a"]);
console.log(set.size); //1
let set = new Set([{},{}]);
console.log(set.size); //2
let a = {key: 'a'};
let b = {key: 'b'};
let set = new Set([a,a]);
console.log(set.size); //1
let set = new Set([a,{a}]);
console.log(set.size); //2

属性

属性有两个：

  1. construct 默认是Set函数
  2. size, 即set中元素的数量

方法

set有四个操作方法：

  1. add() 返回set本身
  2. delete() 返回删除是否成功的布尔值
  3. has() 返回set中是否某个元素
  4. clear() 情况set，没有返回值

这里要注意的是，delete和has中判断两个元素是否相同的方法和初始化中的方法一致，所以尤其要注意对象的判断，基本类型基本不会有问题。

set有四个遍历方法：

  1. keys(): 返回所有的key
  2. values(): 返回所有的value
  3. entries(): 返回所有的键值对
  4. forEach(): 回调函数遍历， 和数组用法一致

因为set中本身没有key，value之分，所key和value都是set中元素本身，我们来看下例子：

1
2
3
4
5
6
let set = new Set(["key1", "key2", "key3"]);
console.log(set.keys());//["key1", "key2", "key3"]
console.log(set.values());//["key1", "key2", "key3"]
console.log(set.entries());//[{"key1": "key1"},{"key2": "key2"},{"key3": "key3"}]

weakSet

weakSet和set类似，只有两个区别：

  1. 元素只能是对象
  2. 对象都是弱引用，即js的垃圾回收机制不会考虑weakSet中的引用

因为第一个特点，所以weakSet不能使用遍历、size等方法和属性(因为遍历的时候可能对象已经被释放了)

用法

set可以用来实现去重等功能，比如：

1
2
3
4
5
let array = [1,2,2,3];
let set = Set(array);
let newArray = Array.from(set);
console.log(newArray); //[1,2,3]

weakSet在互联网上找到的内容不多，阮一峰的《ES6标准入门》中提到，可以用来保存DOM节点，而不用担心节点移除时引起内存泄露。