这是我参与11月更文挑战的第10天,活动详情查看:2021最后一次更文挑战
前言
今天我们来谈一谈关于选择Map还是Object的的问题。ECMAScript 6以前,在 JavaScript 中实现“键/值”式存储可以使用 object 来方便高效地完成,也就是使用对象属性作为键,再使用属性来引用值。但这种实现并非没有问题,为此TC39委员会专门天“键/值”存储定义了一个规范。 作为 ECMAScript 6的新增特性, Map 是一种新的集合类型,为这门语言带来了真正的键/值存储制。 Map 的大多数特性都可以通过 Object 类型实现,但二者之间还是存在一些细微的差异。具体实中使用哪一个,还是值得细细甄别。
举例
与 Object 只能使用数值、字符串或符号作为键不同, Map 可以使用任何 JavaScript 数据类型作为键。 Map 内部使用 Same ValueZero 比较操作( ECMAScript 规范内部定义,语言中不能使用),基本上相当于使用严格对象相等的标准来检查键的匹配性。与 Object 类似,映射的值是没有限制的。
const m = neW Map ();
const symbolKey = Symbol ();
const objectKey = new Object
m . set ( functionKey ," functionValue ");
m . set ( symbolKey ," symbolValue ");
m . set ( objectKey " objectValue ");
alert ( m . get ( functionKey ));
alert ( m . get ( symbolKey ));
alert ( m . get ( objectKey ));1)
alert ( m . get ( function (){}));// undefined
差别与意见
那我们来讲一讲到底是选择 object 还是 Map 呢,或者说我们来谈一谈他们之间的差别吧。
其实选择 Object 还是 Map 只是喜好问题而已,影响不大。不过,对于在乎内存和性能的程序员来说,他们之间确实存在比较明显的差别。
-
第一点就是内存占用的问题。他们之间分配内存机制是不一样的。存储单个键/值对所占用的内存数量都会随键的数量线性增加。大量的添加或删除他们的键/值对内存的的影响就很大了。经过测试,不同浏览器的情况不同,但是在给定固定大小的内存, Map会比 Object 多储存将近一半的键/值对。
-
第二点就是插入性能的问题了。其中向 Object 和 Map 中插人新键/值对的消耗是差不多的,但是插入的速率却不一样。就是说插人 Map 在所有浏览器中一般会比object稍微快一点儿。但是对于这两种类型,他们的速度却不会因为键/值对数量而大幅增加。也就是说要是涉及大量插人操作,那么显然 Map 的性能会更好一些。
-
第三是查找速度。查找速度其实衡量两种类型的重要标准。与插入不同的是,从大型 Object 和 Map 中查找键/值对的性能差异其实是很小的.但如果他们只包含少量的键/值对,Object 有时速度会更快一些。在把 Object 是数组的时候,浏览器引擎会进行优化处理,在内存中使用更高效的布局。但是对 Map 来说是不可以的。当然,他们查找速度也不会随着键/值对数量增加而大幅增加。同样的道理,如果代码涉及大量的查找操作,object其实相比之下会更好一些。
-
第四是删除性能的差异了。其实我们一般不会直接删除object属性,因为其中其中有些是伪删除,一些属性并没有真正的删除,而是被设置为null或者undefined。简而言之,要是代码涉及大量的删除操作,就选map就可以了,不用纠结。