前言
Set集合是一种无重复元素的列表,不会像访问数组元素那样逐一访问每个元素,通常时是用于检测给定值在某个集合中是否存在。
Map集合内含多组键值对,集合中每个元素分别存放着可访问的键名和对应的值,Map经常用于缓存频繁取用的数据。
ES6中的Set集合和Map集合
- Set集合和Weak Set集合
- 创建set集合并添加元素
- set集合forEach()方法
- 将set集合转换为数组
- Weak Set集合
- Map集合和Weak Map集合
- Map集合支持的方法
- Map集合初始化方法
- Map集合forEach()方法
- Weak Map集合
Set集合和Weak Set集合
创建set集合并添加元素
<script>
let set = new Set();//创建set集合
set.add(5);
set.add("5");
console.log(set.has(5)); //true
set.delete(5);
console.log(set.has(5));// false
console.log(set.size); //1
set.clear();
console.log(set.has("5"));//false
console.log(set.size); //0
</script>
Note:
- 通过
new set()
创建set集合; - 通过
add()
向集合中添加方法,set集合中不会对所加入的值进行强制类型转换; - 通过
has()
检测集合中是否存在某个值。 - 通过
delete()
可以删除某个元素; - 通过
clear()
可以清除集合中元素。
set集合有自动去重功能。
set集合forEach()方法
forEach(set集合中下一次索引的位置,与第一个参数一样的值,被遍历的Set集合本身)
let set = new Set([1,2]);
set.forEach(function(value,key,ownSet){
console.log(key +" "+ value);
console.log(ownSet === set);
})
运行结果
1 1
true
2 2
true
Set集合的forEach()和数组的forEach()方法,除了回调函数稍有不同外其他完全相同。
尽管Set集合可以用来跟踪多个值,又可以使用forEach()来遍历,但是不能像数组一样通过索引访问集合中元素,必须先转为数组。
将set集合转换为数组
使用展开运算符...
可以将集合的可迭代对象转为数组。
数组去重
let set = new Set([1,2,4,5,6,7,8,3,4,4]);
array = [...set];
console.log(array);
输出结果为
[1, 2, 4, 5, 6, 7, 8, 3]
Weak Set集合
Set是一个强引用类型集合,只要set实例中的引用存在,垃圾回收机制就不能释放该对象的内存空间。
但有时候当其他引用都不再存在时,希望set集合的引用也随机消失,Weak Set就可以解决此问题。Weak Set
集合是弱引用集合。它只存储对象的弱引用,并且不可以存储原始值,集合中的弱引用如果是对象唯一的引用,则会被回收并释放相应内存。
let set = new WeakSet(),
key = {};
set.add(key);
console.log(set.has(key));//true
set.delete(key);
console.log(set.has(key));//false
Note:
weakSet 构造函数不接受任何原始值,如果数组中包含其他非对象值,程序会抛错。
Set集合和Weak Set集合区别
- WeakSet实例中,如果使用add()方法传入非对象参数会出错,而使用has()和delete()传入非对象参数会返回false。
- weak Set集合不可迭代,所以不能用于
for-of
循环。 - weak set集合不暴露任何迭代器(
keys()和values()
)所以无法通过程序来检测其中内容。 - weak Set不支持forEach()方法和size()属性。
如果只需要处理列表中的应用,更应该使用weak set集合而不是普通的集合。
Map集合和Weak Map集合
Map集合支持的方法
Map集合是一种储存着许多键值对的有序列表,其中键名和对应的值支持所有的数据类型。键名等价性判断是通过Object.is()方法实现的。
<script>
let map = new Map();
map.set("name","Tom");
map.set("age",24);
console.log(map.size);//2
console.log(map.has("name"));//true
console.log(map.get("name"));//Tom
map.delete("name")
console.log(map.has("name"))//false
console.log(map.get("name"));//undefined
map.clear();
</script>
- map.set()添加键名和键值;
- map.get()获取键值;
- map.has(key)检测key是否存在于Map集合中。
Map集合初始化方法
和set类似
let map = new Map([["name","Tom"],["age",25]])
Map集合forEach()方法
和set类似
let map = new Map([["name","Tom"],["age",25]]);
set.forEach(function(value,key,ownMap){
console.log(key +" "+ value);
console.log(ownMap === map);
})
结果
name Tom
true
age 25
true
Weak Map集合
Weak Map集合也是弱引用集合。
Weak Map集合最大的用途是保存Web页面中的DOM元素。
Weak Map集合也不支持forEach()、size属性、以及clear()方法。
如果只用对象作为集合的键名,Weak Map集合是最好的选择,可以避免内存泄漏问题。
如果要使用非对象作为键名,那么普通的Map集合是唯一的选择。
区别:
- WeakMap的键名所指向的对象,不计入垃圾回收机制。
- WeakMap只接受对象作为键名(null除外),不接受其他类型的值作为键名。
只要所引用的对象的其他引用都被清除,垃圾回收机制就会释放该对象所占用的内存。也就是说,一旦不再需要,WeakMap 里面的键名对象和所对应的键值对会自动消失,不用手动删除引用。
场景:一个典型应用场景是,在网页的 DOM 元素上添加数据,就可以使用WeakMap结构。当该 DOM 元素被清除,其所对应的WeakMap记录就会自动被移除。
Note:
WeakMap 弱引用的只是键名,键值依然是正常引用。