ES6学习笔记 —— Set与Map

Set 对象

Set 对象允许你存储任何类型的唯一值，无论是原始值或者是对象引用。

Set 中的特殊值

Set 对象存储的值总是唯一的，所以需要判断两个值是否恒等。有几个特殊值需要特殊对待：

• +0 与 -0 在存储判断唯一性的时候是恒等的，所以不重复；
• undefined 与 undefined 是恒等的，所以不重复；
• NaN 与 NaN 是不恒等的，但是在 Set 中只能存一个，不重复。

Set声明

const set = new Set()

Set属性

• size：返回 Set 对象中值的数量

Set方法

• add(value): 在Set对象尾部添加一个元素，返回该Set对象。
• delete(value): 移除Set的中与这个值相等的元素，有则返回true，无则返回false。
• clear(): 清楚Set的所有元素。
• has(value): 是否存在这个值，如果存在为 true，否则为false。
• keys()：返回键名的遍历器。
• values()：返回键值的遍历器。
• entries()：返回键值对的遍历器。
• forEach()：使用回调函数遍历每个成员。

 Set方法使用：

	let mySet = new Set()

	//add()
	mySet.add('1')
	mySet.add(1)
	console.log(mySet) // Set(2) {1, "1"}

	//size
	console.log(mySet.size) // 2

	//delete()
	mySet.delete('1')
	console.log(mySet) // Set(1) {1}

	//has()
	console.log(mySet.has(1)) // true
	console.log(mySet.has(2)) // false

	//clear()
	mySet.clear()
	console.log(mySet) // Set(0) {}

	let arr = [{id: 1}, {id: 2}, {id: 3}]
	let mySet1 = new Set(arr)

	// keys()
	for (let key of mySet1.keys()) {
		console.log('key:', key); // key:{id: 1} key:{id: 2} key:{id: 3}
	}

	//values()
	for (let key of mySet1.values()) {
		console.log('values:', key); // values:{id: 1} values:{id: 2} values:{id: 3}
	}

	//entries()
	for (let data of mySet1.entries()) {
		console.log('entries:',	data); // entries:[{id: 1},{id: 1}] entries:[{id: 2},{id: 2}] entries:[{id: 3},{id: 3}]
	}

	//forEach
	mySet1.forEach((item) => {
		console.log('forEach:', item) // forEach:{id: 1} forEach:{id: 2} forEach:{id: 3}
	});

Set对象应用

// 数组去重
var mySet = new Set([1, 2, 3, 4, 4]);
[...mySet]; // [1, 2, 3, 4]

// 字符串去重
[...new Set('ababbc')].join('')  // "abc"

 let a = new Set([1, 2, 3])
 let b = new Set([2, 4, 3])
 
//并集
let union = new Set([...a, ...b]))  // {1, 2, 3, 4}
 
//交集
let intersect  = new Set([...a].filter(x => b.has(x))) // {2, 3}
 
// 差集
// （a 相对于 b 的）差集
let difference = new Set([...a].filter(x => !b.has(x))) // {1}

// 映射
// 方法一
let set = new Set([1, 2, 3]);
set = new Set([...set].map(val => val * 2));
// set的值是2, 4, 6

// 方法二
let set = new Set([1, 2, 3]);
set = new Set(Array.from(set, val => val * 2));
// set的值是2, 4, 6

Map 对象

Map 对象保存键值对。任何值(对象或者原始值) 都可以作为一个键或一个值。

Map属性

• size：返回 Map 结构的成员总数。

Map方法

• set(key,value): 设置键名key对应的键值为value的键值对，若key已存在，更新键值。
• get(key): 返回key对应的值。
• delete(key): 移除Map的中与这个值相等的元素，有则返回true，无则返回false。
• clear(): 清除所有成员，没有返回值。
• has(key): 是否存在这个值，如果存在为 true，否则为false。
• keys()：返回键名的遍历器。
• values()：返回键值的遍历器。
• entries()：返回所有成员的遍历器。
• forEach()：遍历 Map 的所有成员。

	let myMap = new Map()

	//set(key,value)
	myMap.set('a', 1)
	myMap.set('b', 2)
	console.log(myMap) // Map(2) {'a' => 1, 'b' => 2}

	//get(key)
	console.log(myMap.get('a')) // 1

	myMap.set('a', 3)
	console.log(myMap.get('a')) // 3  同一个键多次赋值，后面的值将覆盖前面的值。

	//size
	console.log(myMap.size) // 2

	//delete(key)
	myMap.delete('a') // true
	console.log(myMap) // Map(1) {'b' => 2}

	//has(key)
	console.log(myMap.has('b')) // true
	console.log(myMap.has(1)) // false

	//clear()
	myMap.clear()
	console.log(myMap) // Map(0) {}

	let arr = [['a', 1],['b', 2],['c', 3]]
	let myMap1 = new Map(arr)

	// keys()
	for (let key of myMap1.keys()) {
		console.log('keys:', key); // keys:a keys:b keys:c
	}

	//values()
	for (let value of myMap1.values()) {
		console.log('values:', value); // values:1 values:2 values:3
	}

	//entries()
	for (let data of myMap1.entries()) {
		console.log('entries:', data); // entries:["a", 1] entries:["b", 2] entries:["c", 3]
	}

	//forEach
	myMap1.forEach((item) => {
		console.log('forEach:',item) // forEach:1 forEach:2 forEach:3
	});

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

（1）Map 转为数组

使用扩展运算符（...）。

const myMap = new Map()
  .set(true, 7)
  .set({foo: 3}, ['abc']);
[...myMap]
// [ [ true, 7 ], [ { foo: 3 }, [ 'abc' ] ] ]

（2）数组 转为 Map

将数组传入 Map 构造函数，就可以转为 Map。

new Map([
  [true, 7],
  [{foo: 3}, ['abc']]
])

（3）Map 转为对象

如果所有 Map 的键都是字符串，它可以无损地转为对象。

function strMapToObj(strMap) {
  let obj = Object.create(null);
  for (let [k,v] of strMap) {
    obj[k] = v;
  }
  return obj;
}

const myMap = new Map()
  .set('yes', true)
  .set('no', false);
strMapToObj(myMap)
// { yes: true, no: false }

如果有非字符串的键名，那么这个键名会被转成字符串，再作为对象的键名。

（4）对象转为 Map

对象转为 Map 可以通过Object.entries()。

let obj = {"a":1, "b":2};
let map = new Map(Object.entries(obj));

此外，也可以自己实现一个转换函数。

function objToStrMap(obj) {
  let strMap = new Map();
  for (let k of Object.keys(obj)) {
    strMap.set(k, obj[k]);
  }
  return strMap;
}

objToStrMap({yes: true, no: false})
// Map {"yes" => true, "no" => false}

（5）Map 转为 JSON

Map 转为 JSON 要区分两种情况。一种情况是，Map 的键名都是字符串，这时可以选择转为对象 JSON。

function strMapToJson(strMap) {
  return JSON.stringify(strMapToObj(strMap));
}

let myMap = new Map().set('yes', true).set('no', false);
strMapToJson(myMap)
// '{"yes":true,"no":false}'

另一种情况是，Map 的键名有非字符串，这时可以选择转为数组 JSON。

function mapToArrayJson(map) {
  return JSON.stringify([...map]);
}

let myMap = new Map().set(true, 7).set({foo: 3}, ['abc']);
mapToArrayJson(myMap)
// '[[true,7],[{"foo":3},["abc"]]]'

（6）JSON 转为 Map

JSON 转为 Map，正常情况下，所有键名都是字符串。

function jsonToStrMap(jsonStr) {
  return objToStrMap(JSON.parse(jsonStr));
}

jsonToStrMap('{"yes": true, "no": false}')
// Map {'yes' => true, 'no' => false}

但是，有一种特殊情况，整个 JSON 就是一个数组，且每个数组成员本身，又是一个有两个成员的数组。这时，它可以一一对应地转为 Map。这往往是 Map 转为数组 JSON 的逆操作。

function jsonToMap(jsonStr) {
  return new Map(JSON.parse(jsonStr));
}

jsonToMap('[[true,7],[{"foo":3},["abc"]]]')
// Map {true => 7, Object {foo: 3} => ['abc']}

学习网站地址：http://caibaojian.com/es6/destructuring.html