Sets and Maps
我们知道ES6之前,array是唯一的集合类型,数组是数字索引(numeric index)的键值对组合,当我们需要非数字索引的键值对时,必须使用非数组对象来模拟这种情况,ES6新添加了Sets和Maps这两种集合类型。
Set是一系列值的集合,这些值不能重复,内部使用 Object.is() 来判断两个值是否相同,一般我们不访问set中的单个值,而是检查是否存在某个值;Map是一系列键(keys)和相对应值(values)的集合,多用于数据缓存,该数据稍后取回。下面从几个方面来介绍这两个新集合类型:
- ES6之前实现sets和maps的workaround;
- Set & WeakSet;
- Map & WeakMap;
一.模拟Sets,Maps
1.模拟set 和 map
使用对象属性来模拟set,然后判断该属性是否存在
var set = Object.create(null); // 使用null作为原型,确保没有继承的属性
set.foo = true;
// 检测存在性
if (set.foo) {
// code to execute
}
一个对象用作set 还是 map 唯一的不同之处在于值得存储方式不同,模拟map
var map = Object.create(null);
map.foo = "bar";
// 取回值
var value = map.foo;
console.log(value); // "bar"
2.模拟会出现的问题
我们知道对象只能使用字符串作为keys(ES6新添加symbols作为keys),所有的其他类型当作keys,都会被转换成字符串类型。
比如 5 转换成 "5", 所有的对象类型 都转换成 "[object Object]" (obj.toString()),这样很难使用对象当作keys
var map1 = Object.create(null);
map1[5] = "foo";
map1["5"]; // "foo" 数字键转换成字符串
-----------------
var map2 = Object.create(null);
var key1 = {};
var key2 = {};
map2[key1] = "foo";
map2[key2]; // "foo" 对象类型都转换成字符串"[object Object]"
set检测:
var set = Object.create(null);
set.count = 1;
if (set.count) { //检测count是否存在,还是 count===0 的情况,比较模糊
// ...
}
二.Sets & WeakSets
集合中不存在重复的值(duplicate values),通过Object.is()判断两个值是否相同
1.Set方法属性
- add(value): 添加到set集合中
- delete(value): 删除value,删除成功返回true,否则false
- has(value): 判断是否存在该value值,存在返回true,不存在则返回false
- clear(): 清空set中所有值
- size: set集合中的值个数
eg:
var mySet = new Set();
mySet.add(5);
mySet.add("5");
var key1 = {};
var key2 = {};
// 引用类型通过Object.is()判断是否相同
mySet.size; // 4 Set {5, "5", Object {}, Object {}}
mySet.delete(5); // true
mySet.delete(10); // false
mySet.has("5"); // true
mySet.size; // 3 Set {"5", Object {}, Object {}}
mySet.clear(); // Set {}
2.创建set集合
Set构造器中可以传入一个可迭代对象作为参数(比如数组),重复的值将会被去除
var mySet = new Set([1, 2, 2, 4, 4, 5]);
mySet.size; // 4 Set {1, 2, 4, 5}
可以利用这一特性将数组中重复的值去除
var arr = [1, 2, 2, 4, 4, 5];
var set = new Set(arr); // Set {1, 2, 4, 5}
// 利用rest items将set集合转变为新数组
var arr1 = [...set]; // arr1 [1, 2, 4, 5]
可以封装这个方法
function eliminateDuplicates(arr) {
return [...new Set(arr)];
}
3.forEach方法
forEach方法一般有3个参数
- value
- key(set中我们将键和值等同起来,即值同时也是键)
- 集合自身set
set中没有键,将键和值等同起来,是为了与其他使用forEach的集合保持一直,如array, maps
var set = new Set([1, 2]);
set.forEach(function(value, key, ownerSet)) {
console.log(key + ":" + value);
console.log(ownerSet === set);
}
// output:
1:1
true
2:2
true
forEach中还可以接入第2个参数this,用于指定上下文
let set = new Set([1, 2]);
let processor = {
output(value) {
console.log(value);
},
process(dataSet) {
dataSet.forEach(function(value) {
this.output(value);
}, this)
}
};
processor.process(set); // 1, 2
// 可以使用箭头函数
let processor = {
output(value) {
console.log(value);
},
process(dataSet) {
dataSet.forEach(value => this.output(value));
}
};
4.WeakSet
WeakSet是用于系统GC, 消除不再引用的对象,主要是性能方面的关系,和Set比较起来主要有以下几个方面区别:
- WeakSet中只能存储对象, 不能存储primitive类型值;
- add(), delete(), has()参数中只能传入引用类型参数,传入原始类型会抛出异常;
- WeakSet没有暴露任何迭代器,for...of..., keys(), values(), forEach(), clear()方法均不能使用;
- WeakSet中不存在size属性,因此不能通过weakSet.size来判断weakSet中是否存在值
原始Set集合:
let set = new Set(),
key = {};
set.add(key);
console.log(set.has(key)); // true
// 消除原始引用
key = null;
console.log(set.size); // 1 表明并没有GC set中的值
// 取回原始引用
key = [...set][0]; // {}
WeakSet集合:
let key1 = {},
key2 = {},
weakSet = new WeakSet([key1, key2]);
weakSet.has(key1); // true
weakSet.has(key2); // true
// 移除对key1,key2的引用,同时也会从 weak set中移除
key1 = null;
key2 = null;
Maps & WeakMaps
maps通过键值对来存储数据,键keys可以为任意类型
1.maps方法属性
- set(key, value): 添加键值对;
- get(key): 获取key对应的值, 若不存在返回undefined;
- delete(key): 删除键值对;
- has(key): 判断是否存在该键;
- clear(): 清空集合;
- size: 集合的长度
eg
let map = new Map();
map.set("name", "Nicholas");
map.set("age", 29);
map.size; // 2 Map {"name" => "Nicholas", "age" => 29}
map.get("name"); // "Nicholas"
map.has("age"); // true
map.delete("name"); // true
map.clear();
map.size; // 0
2.创建Map集合
和Set集合一样,Map构造函数可以添加一个可迭代的对象(比如数组)当作参数,快速创建集合
let map = new Map([["name", "james"], ["age", 27]]);
3.forEach方法
和Set中的forEach方法一样能加入3个参数(value, key, ownerMap)
let map = new Map([["name", "kobe"], ["age", 37]]);
map.forEach((v, k, m) => console.log(k + ":" + "v"));
// output
name:kobe
age:37
4.WeakMap
和Map的区别:
-
只能使用对象作为keys,使用其他类型会抛出错误;
- 不存在clear()方法,不具备可迭代的能力, forEach(), for...of...等不能使用;
- 不存在size属性,因此无法判断WeakMap是否为空
let key1 = {},
key2 = {};
let weakMap = new WeakMap([[key1, "hello"], [key2, 42]]);
weakMap.has(key1); // true
weakMap.get(key1); // "hello"
weakMap.delete(key2); // true
什么时候使用WeakMap呢?
- 只使用对象作为键时(only using object keys),WeakMap是最好的选择;
- WeakMap能优化内存使用,避免内存泄漏,但当要使用forEach(), clear(), size等属性方法时,最后选择使用Map;
- 当要使用非对象键(nonobject keys), Map则是唯一的选择
总结
通过这一章我们学习了ES6新添加的两个集合类型,Set多用于判断一个集合中是否存在某个值,而Map则多用于存储键值对数据,然后取回数据进行使用;
同时介绍了WeakSet和WeakMap另外两个集合,这两个集合多用于优化内存,避免内存泄漏等,这两个集合相对于Set和Map,有些方法和属性不存在,使用时应当注意。