4、数据结构 Map—ES6学习笔记

来源:互联网 发布:cc域名免费注册 编辑:程序博客网 时间:2024/04/30 07:09

Map是一种典型的字典类型的数据结构
所谓的字典类型的数据结构,就是是用来存储不重复key的Hash结构。比如说JS中对象,就是字典类型的数据结构的一种。

字典:是用来存储不重复key的Hash结构。不同于集合(Set)的是,字典使用的是[键,值]的形式来储存数据的。

JavaScript 的对象(Object:{})只能用字符串当作键。这给它的使用带来了很大的限制。

var data1 = {a: 1}, data2 = {b: 2}, obj = {};//我们给obj添加两个属性obj[data1] = 1;obj[data2] = 2;console.log(obj);//2 我们发现这个对象中只添加了一条//这是因为当浏览器的引擎发现这个key是个对象的时候,//就会调用这个对象的toString()方法,将其转换为字符串//我们可以看看对象转化为字符串是什么?console.log(data1.toString());//[object object]console.log(data1.toString() === data2.toString());//true//这就很好的说明了为什么data2等于2了

为了解决这个问题,ES6提供了Map数据结构。
它类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。
也就是说,Object结构提供了“字符串—值”的对应,Map结构提供了“值—值”的对应,是一种更完善的Hash结构实现。


如果需要“键值对”的数据结构,Map比Object更合适。。


1 如何创建一个 Map

在创建这个数据结构的时候,我们还可以给他初始化一些参数
它可以接收一个二维数组,里面的数组是一个键值对的组合

const map = new Map([  ['a', 1], //这就代表了初始化了一个键是'a',值是1的值  ['b', 2]]);console.log(map);//a对应1,b对应2

2 Map 类的属性
Map的属性只有一个,和Set是一样的,也就是size,代表当前数据结构里面元素的个数

console.log(map.size); //2 这就说明了Map数据结构中有两个元素

了解了基本的属性之后,我们再来看看Map这些数据结构提供的一些方法

set()是给Map这种数据结构添加新的键值对的

1 set(key, value) 设置键名key对应的键值为value,然后返回整个 Map 结构。如果key已经有值,则键值会被更新,否则就新生成该键。

我们举个例子:

//第一个参数就是键值对的 key ,我们这里叫做zhang//第二个参数就是键值对的值 ,这里我们叫做silang//由于set方法返回的就是Map对象的本身,也就是说我们可以链式的添加//map.set('zhang', 'silang').set('new', 'fq');console.log(map);//可以发现我们后面添加的键值对就添加到这个Map这个数据结构当中了//如果说重复的添加某个属性map.set('zhang', 'silang').set('new', 'fq').set('zhang', 'san');console.log(map);//我们发现前面添加的键值对就被后面添加的键值对覆盖掉了

2 get(key) get方法读取key对应的键值,如果找不到 key,返回undefined。

console.log(map.get('new')); //fqconsole.log(map.get('x')); //undefined

3 delete(key) 删除某个键,返回true。如果删除失败,返回false。

console.log(map.delete('a')); // trueconsole.log(map);             //a已经没有了console.log(map.delete('a')); //false 因为之前已经删除了a,那么现在已经没有a了,所以返回false

4 has(key) 方法返回一个布尔值,表示某个键是否在当前Map对象之中。

console.log(map.has('zhang')); //true 由于之前我们添加过来,所以返回trueconsole.log(map.has('a'));//false 因为之前我们把a删除了,所以返回了false

5 clear() 清除所有数据,没有返回值。

map.clear();console.log(map); //我们发现Map数据结构里面的数据都被清空了

接下来这几种方法都是用来遍历数据结构的


6 keys() 返回键名的遍历器

console.log(map.keys());//"b","zhang","new"

7 values() 返回键值的遍历器

console.log(map.values());//2,"san",fq

8 entries() 返回键值对的遍历器

console.log(map.entries());//{{"b",2},{"zhang","san"},{"new","fq"}}

9 forEach() 使用回调函数遍历每个成员
在用法上和Set()的forEach()是非常类似的

他的参数是一个回调函数,在回调函数当中又有三个参数

//三个值分别对应键,以及键对应的值,以及Map本身map.forEach(function (key, value, map){   console.log(key + ':' + value);//这样控制台就打印出了所有的Key和所有的值 })

Map 在使用过程中的一些注意事项:
我们都知道NaN和他本身是不相等的,
但是我们两个键值对的键都是NaN

map.set(NaN, 10).set(NaN, 100);console.log(map);//可以发现只添加了最后一次的NaN

也就是说在Map这种数据结构中,它认为NaN是同一个键


如果说在Map这种数据结构下,key是个对象的情况下

map.set({}, 'x').set({}, 'y');console.log(map);//我们发现这两个对象分别对应x和y//原因就是一个空对象和另外一个空对象,他们两个比较是一个falseconsole.log({} === {});//false//这是因为引用数据类型比较的是它的内存地址而不是它们的值

通过上面的例子我们知道Map的键实际上是和内存地址绑定的
只要内存地址不一样,就视为两个键
这样就从根本上解决了同名碰撞的问题

所以说以后我们在扩展别人写的库的时候,如果使用对象作为键名,就不用担心自己的属性与原来的库重名了

Map里面key的排列顺序永远是按照添加的顺序排列的

原创粉丝点击