ES6 Map数据结构

1.Map是什么？

ES6 提供的另一种新的引用类型的数据结构它类似于对象，也是键值对的集合，但是**"键"的范围不限于字符串**，各种类型的值（包括对象）都可以当作键）

以前引用类型中的对象也是键值对的集合但是键限于字符串

总结起来就是:

Object 结构提供了"字符串---值"的对应，
Map 结构提供了"值---值"的对应，是一种更完善的 "键值对" 结构实现。
如果你需要"键值对"的数据结构，Map 比 Object 更合适
对象作为键，会隐式的调用toString()方法，从而导致后一个覆盖前一个键
接受数组作为参数，该数组必须表示键值对的数组
Map传址，所以对象作为键名时传输的是地址，相同{},{}形式最为键，值不相等
Map接受数组作为参数的本质是通过forEach()循环，然后循环体内使用解构赋值items.forEach(([key, value],index) => map.set(key,value))
Map自带方法keys(),values(),entries(),forEach()等
Map参数的扩展：只要是具有 Iterator 接口且成员为键值对都可以作为Map的参数

2.怎么声明Map数据结构及Map的方法：set(), get(), has(), delete()

javascript 复制代码

        const m = new Map();
        const o = { p: 'Hello World' };
        m.set(o, 'content')
        console.log( m.get(o) ); //"content"
        console.log( m.has(o) );// true
        console.log( m.delete(o) );// true
        console.log( m.has(o) );// false

3.证明是引用类型数据 instanceof 、Object.prototype.toString().call()

为什么instanceof可以判断对象或数组？

https://blog.csdn.net/qq_34569497/article/details/133889333

javascript 复制代码

let res = map instanceof Map
let resMap = Object.prototype.toString.call(map)
console.log(res); // true
console.log(resMap); // [object Map]

4.Map和对象的区别：对象作为键，会隐式的调用toString()方法，从而导致后一个覆盖前一个键

对象作为键，会隐式的调用toString()方法，从而导致后一个覆盖前一个键

javascript 复制代码

        let o1 = { a: 1 }
        let o2 = { b: 1 }
        let o3 = {}
        o3[o1] = 1
        o3[o2] = 2
        console.log(o3) // [object Object]: 2
        Object.keys(o3).map((v, i) => {
            console.log(v); // [object Object]
            console.log(i); // 0
            console.log(typeof v); // string
        })

Map就不存在覆盖：

javascript 复制代码

        let o1 = { a: 1 }
        let o2 = { b: 1 }
        let o3 = new Map()
        o3.set(o1, '123')
        o3.set(o2, '234')
        console.log(o3);
        console.log(o3.get(o1));
        console.log(o3.get(o2));

5.接受数组作为参数------该数组必须是表示键值对的数组

作为构造函数，Map 也可以接受一个数组作为参数。注意该数组的成员是一个个表示键值对的数组。

javascript 复制代码

const map = new Map([
  ['name', '张三'],
  ['title', 'Author']
]);
map.get('name') // "张三"
map.get('title') // "Author"

6.Map传址特点--对象作为键名时，传输的是地址，所以下例中的两个{x:1}虽然长相一样，但实际值不同（存储在堆内存的两个位置）

对象作为键名时，传输的是地址，所以下例中的两个 {name:'曹操'} 虽然长相一样，但实际值不同（存储在堆内存的两个位置）

javascript 复制代码

const map = new Map([
  ['name', '张三'],
  ['title', 'Author'],
  [{name:'曹操'},'枭雄']
]);
map.get('name') // "张三"
map.get('title') // "Author"
map.get({name:'曹操'});//返回undefined。为什么？因为应用数据类型比较的是地址 {name:'曹操'} !=={name:'曹操'}。

想要obj最为key并且可以获取值，必须以下面形式才行：

javascript 复制代码

let obj = {name:'曹操'};
const map = new Map([obj,'枭雄']);
map.get(obj);//'枭雄'

7.Map构造函数接受数组作为参数的本质，内部机制使用forEach进行遍历

内部机制：

通过items通过forEach()进行遍历 ,items.forEach(([key, value],index) => map.set(key,value))
并且使用到数组解构的模式匹配

javascript 复制代码

const items = [
  ['name', '张三'],
  ['title', 'Author']
];
const map = new Map();
items.forEach(([key, value],index) => map.set(key,value))

8.Map自带的一些方法 keys() values() entries()

9.Map参数的扩展

任何具有 Iterator 接口 、且每个成员都是一个双元素的数组的数据结构 都可以当作Map构造函数的参数

javascript 复制代码

const set = new Set([
  ['foo', 1],
  ['bar', 2]
]);
const m1 = new Map(set);
m1.get('foo') // 1
const m2 = new Map([['baz', 3]]);
const m3 = new Map(m2);
m3.get('baz') // 3