ES6中的数据结构Map的理解和描述
1、什么是Map?
JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。
Map类型的数据结构，类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象、null、undefined、false、0、空字符串，false等）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Object 更合适。
利用Map构造函数生成一个简单地Map类型对象
const map = new Map( [ ['name', '李大师'], ['title', 'title'] ] ) console.log(map)
2、Map实例对象的属性和操作方法
(1) Map.prototype.size 这个属性返回Map的总得成员数量
(2) Map.prototype.set(key, value) , 设置Map的成员，如果没有这个key,则新增，如果已经有这个key,则使用新值覆盖旧值
const map = new Map() const obj = { a : 1} map.set(obj, 2) map.set(null, 0) map.set('a' ,1) map.set(0, false) map.size // 4
（3）Map.prototype.get(key) get方法读取key对应的键值，如果找不到key，返回undefined。
（4）Map.prototype.has(key) has方法返回一个布尔值，表示某个键是否在当前 Map 对象之中。
（5）Map.prototype.delete(key) delete方法删除某个键，删除成功后返回true。如果删除失败，返回false。
（6）Map.prototype.clear() clear方法清除所有成员，没有返回值。
const map = new Map() const obj = { a : 1} map.set(obj, 2) map.set(null, 0) map.set('a' ,1) map.set(0, false) map.size // 4 map.get(obj) // 2 map.get(null) // 0 map.has(0) // true map.delete(0) // true map.clear() map.size // 0
3、Map数据结构的遍历器方法
Map.prototype.keys(), Map.prototype.values(), Map.prototype.entries(), Map.prototype.forEach()
注意在使用forEach时，和数组以及Set结构中类似，函数参数中的第一个参数是value,第二个是key,使用时要注意这一点
const map = new Map() const obj = { a : 1} map.set(obj, 2) map.set(null, 0) map.set('a' ,1) map.set(0, false) map.size // 4 map.get(obj) // 2 map.get(null) // 0 map.has(0) // true map.delete(0) // true const keys = map.keys() for(let item of keys) { console.log(item) } // {a :1 }, null , a const values = map.values() for(let item of values) { console.log(item) } //2 ,0 ,1 const en = map.entries() for(let item of en) { console.log(item) } // [ {a: 1}, 2] [null, 0] , ['a', 1] map.forEach((value, key)=>{ console.log(value, key) }) // 2 {a: 1} 0 null 1 'a'
4、Map与数组Array之间的转换
可以使用扩展运算符...， 也可使用Array.prototype.form（）方法
const map = new Map() map.set(0, 0) map.set(1, 1) map.set(2, 2) map.set(null, null) const array = Array.from(map) const arr2 = [...map] console.log(array) // 输出 [[0,0], [1,1], [2, 2], [null, null]] console.log(arr2) // 输出 [[0,0], [1,1], [2, 2], [null, null]]
将数组结构的数组转为map, 注意由于Map是键值对类型的结构，那么必须是二维数组的形式
const arr1 = [ [ 1, 2 ], [3, 4], [5,6]] const map1 = new Map(arr1) const en1 = map1.entries() for(let item of en1) { console.log(item) } // [1, 2], [3, 4], [5,6] const arr2 = [[1, 2, 3], [ 4,5,6,7], [8,9,10]] const map2 = new Map(arr2) const en2 = map2.entries() for(let item of en2) { console.log(item) } // [1, 2], [4, 5] , [8 ,9] const arr3 = [[ 1, [2, 3]], [4, [5, 6, 7]], [8, [9, [10,11]]] ] const map3 = new Map(arr3) const en3 = map3.entries() for(let item of en3) { console.log(item) } // [1, [2, 3]], [4, [5,6,7]], [8, [9, [10, 11]]]
将JSON或者对象转为Map
JSON对象或者合法的Object对象的key都是字符串，那么转为Map非常容易
function objectTomap(obj) { const map = new Map(); for (let k of Object.keys(obj)) { map.set(k, obj[k]); } return map } const obj = { a : 1 , b: 2, c: 3 } const map = objectTomap(obj) const en = map.entries() for(let item of en) { console.log(item) } // ['a', 1], ['b', 2], ['c', 3]
5、注意事项
在map中，同一个变量在key中是不允许重复的，但是同一个引用类型的对象却是可以的
const map = new Map() const arr = [1] map.set(arr, 1) map.set([1], 1) map.set([1], 2) map.get(arr) // 1 map.get([1]) // undefined // 这是因为[1] != [1] ,数组和对象都指向 不同的引用的地址，那么即使 map.set([1], 1) map.get([1]) // undefined， 因为这里的[1]已经是一个新的数组，而不是上面那个set操作里的那个[1], 如果想这么设置就需要定义一个变量 const arr2 = [1] map.set(arr2, 1) map.get(arr2) // 1, 因为这里的arr2是一个独一无二的引用 const arr3 = arr2 map.set(arr3, 2) map.get(arr2) // 2 map.get(arr3) // 2 // 同一个引用下指向的地址相同
