JavaScript之Set与Map

https://www.boatsky.com/blog/47

ES5中的数据类型分原始类型与对象类型。其中原始类型有Number,Boolean,String,null,undefined，ES6中增加Symbol。ES5对象类型为Object，从功能区别，广义的Object又细分成几种“子对象”，普通Object(“命名值”的无序集合)、数组（带编号的值的有序集合）、函数（具有与它相关联的可执行代码的对象），ES6新增了Set(无重复元素的集合)、Map(多组键值对的集合)。

	<a href="http://www.boatsky.com/blog/47.html">Set与Map</a>早在ES6之前就有被模拟实现，ES6让其成为标准，使用起来更加简单。

	###Set
	Set是一种无重复元素的集合，因其key与value是相同的，所以我们只讨论它的value。

	它的value取值可以是所有原始数据类型Number,Boolean,String,null,undefined,Symbol，及对象数据类型Object,Array,Function,Set,Map等，并且它不会在存取前后进行类型转换。

	Set提供了add,has,size,delete操作方法
	#####add(value)
	增加值，返回增加后的set对象。
	#####has(value)
	判断是否有该值，返回布尔值
	#####size
	判断长度，返回数字
	#####delete(value)
	删除值，返回布尔值
	#####clear()
	清空集合

	demo:
	```javascript
	console.log(set.add('5'));//set对象
	console.log(set.has(5));//false
	console.log(set.has('5'));//true
	console.log(set.size);//1
	console.log(set.delete('5'));//true
	console.log(set.has('5'));//false
	```
	Set可使用keys,values,entries,forEach方法。因为key与value是一样的，keys与values结果都一样。entries返回item的是key与value数组。forEach为了与其他对象参数保持一致，第一个参数与第二个参数很多余的一样了。
	demo:
	```javascript
	let set = new Set();
	let aObj = {a: 1};
	let bObj = {b: 2};
	set.add(aObj).add(bObj);
	for (let k of set.keys()) {
	console.log(k);
	}
	//{a: 1}
	//{b: 2}

	for (let v of set.values()) {
	console.log(v);
	}
	//{a: 1}
	//{b: 2}

	for (let item of set.entries()) {
	console.log(item);
	}
	// [{a: 1},{b: 2}]
	// [{a: 1},{b: 2}]

	set.forEach(function(key, value, ownSet) {
	console.log(valueCopy);
	});
	//{a: 1}
	//{b: 2}
	```

	因为Set是不可重复的，所以数组的去重一行简单的代码便实现了:
	```javascript
	let arr = [1, 1, 2, 2, 3, 3];
	[...new Set(arr)];
	```

	Set是强引用的集合，如果原始引用被移除了，Set集合并不会删除原值，垃圾回收机制也无法对其回收：
	```javascript
	let set = new Set();
	let key = {};
	set.add(key);
	console.log(set.has(key));//true
	for (let item of set.entries()) {
	console.log(item);
	}
	// [{},{}]

	key = null;
	console.log(set.has(key));//false
	for (let item of set.entries()) {
	console.log(item);
	}
	// [{},{}]
	```

	内存无法释放，可能引起内存泄漏，为此Set有个WeakSet扩展，使用弱引用，解决这个问题，但WeakSet只支持add,has,delete方法，其他方法都不支持，并且不能传入原始值。虽然可以用上述的has判断，但我们需传递强引用才能验证弱引用是存被移除，这无法在代码上实现，因为我们只能传递弱引用key：
	```javascript
	let set = new WeakSet();
	let key = {};
	set.add(key);
	console.log(set.has(key));//true
	key = null;
	console.log(set.has(key));//false
	```
	此时我们无从得知，第二个set.has(key)为false是因为
	[{},{}] !== [null,null]还是set是空集合。只能从概念上得知，是后者。

	###Map
	Map是多组键值对的有序集合，与Set几乎是一样的，参考上述Set即可，在此不做复述，只简述不同之处。

	key与value可以不同。Map与Set相比，新增了set,get方法。

	#####set(key,value)
	设置值，返回map
	#####get(key)
	取值

	Map也有一个与之对应的WeakMap，参见上述WeakSet，不同之处，key必须为对象，且不能为null，否则报错，而value则无限制。</textarea>

JavaScript之Set与Map相关推荐

百度地图JavaScript API经纬度查询-MAP
百度地图JavaScript API经纬度查询-MAP-ABCDEFGHIJKMHNOPQRSTUVWXYZ: 搜索:<input type="text" size=&quo ...
Javascript ES6 Set、Map、Proxy、Symbol
<!DOCTYPE html> <html><head><meta charset="utf-8"><title>< ...
JavaScript学习笔记_5 Map
Map key与value一一对应, 查找速度快于一般array let name = ["dick", "fuck", "idoit"]; ...
JavaScript遍历数组、Map
<script>var arr = [3,4,5,6,34]//打印下标for(var x in arr){console.log(x)}</script> <scrip ...
JavaScript创建Map对象（转）
JavaScript 里面本身没有map对象,用JavaScript的Array来实现Map的数据结构. Js代码 /* * MAP对象,实现MAP功能 * * 接口: * size() ...
javascript map 排序_数据结构-JavaScript字典结构的编程实现
字典是一类特殊的数据元素的集合,字典的基本单元为数对,所谓数对是指类似(key,value)形式的数据.每一个数对结构包括了关键字key与该元素对应的value值,在一个普通字典所组成的数对集合中,关 ...
轻量函数式 JavaScript：八、列表操作
你在前一章闭包/对象的兔子洞中玩儿的开心吗?欢迎回来! 如果你能做很赞的事情,那就反复做. 我们在本书先前的部分已经看到了对一些工具的简要引用,现在我们要非常仔细地看看它们,它们是 map(..).f ...
在JavaScript中逐个遍历数组？
如何使用JavaScript遍历数组中的所有条目? 我以为是这样的: forEach(instance in theArray) 其中theArray是我的数组,但这似乎是不正确的. #1楼如果您不 ...
Jquery each和map 的区别
1,回调函数的参数顺序相反,each:i,elem,map:elem,i 2,返回值不同,map返回一个新的数组,each返回原始数组回调的返回值,each只能返回 true 和 false,map ...

JavaScript之Set与Map

JavaScript之Set与Map相关推荐

最新文章

热门文章