本教程操作环境:windows7系统、ecmascript 6版、dell g3电脑。
map是引用类型。
es6 map在es6之前,在javascript中实现‘键’=>‘值’,也就是我们常说的键值对,是用object来完成的。但这种实现方式在特殊场景下的有问题的,es6又出了一个为map的新集合类型,为这门语言带来正真的键值对存储机制。
map(集合)是es6新增的一种引用数据类型,表示数据的映射关系;map集合数据类型中数据是以“键/值”的方式存储的,可以使用对象的属性作为键,使用属性来引用值。
1-1 创建map
使用new关键字来实例一个map
let m = new map();console.log(m);// map(0) {}
创建时初始化:
传入一个二维数组参数(可迭代对象,内部以数组的方式传入键值)
每个子数组,第一个元素是map对应的key, 第二个元素是map对应的value
let m = new map([[{}, 222], [{}, '123']]);console.log(m);// map(2) { {} => 222, {} => '123' }
1-2 map api
1-2-1 添加映射元素通过set()方法添加,传入两个参数,第一个传入映射的键,第二个传入映射的值。返回的是该映射集合(意味着可以链式添加)
let m = new map();m.set('prop', '值');console.log(m);// map(1) { 'prop' => '值' }
链式添加键值
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});console.log(m);// map(3) { 'prop' => '值', 'prop2' => false, 'num' => { id: 13 } }
1-2-2 映射集合长度使用size属性可以获取到当前集合元素数量
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});console.log(m.size);
1-2-3 获取元素通过get()方法获取到元素,传入获取目标的key
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});console.log(m.get('prop2'));// false
1-2-4 删除元素通过delete()方法删除映射集合中的某个元素,返回删除成功或失败的布尔值
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});m.delete('prop2');// trueconsole.log(m.get('prop2'), m.size);// undefined 2
1-2-5 检测元素是否存在使用has()方法检测目标元素是否存在,返回检测结果的布尔值
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});m.delete('prop2');// trueconsole.log(m.has('prop2'), m.has('num'));// false true
1-2-6 清除元素方法使用clear()方法可以清除所有的元素, 返回清除成功的布尔值
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});m.clear();// trueconsole.log(m);// map(0) {}
1-3 顺序与迭代
map可以根据插入顺序迭代元素
映射实例会提供(iterator).能够以插入的顺序生成[key, value]形式的数组, 可以通过entries()方法(或者提供的symbol.iterator)迭代器接口遍历。
let m = new map();m.set('prop', '值').set('prop2', false).set('num', {id: 13});console.log(m.entries === m[symbol.iterator]);// truefor(let k1 of m.entries()){ console.log(k1); // [ 'prop', '值' ] // [ 'prop2', false ] // [ 'num', { id: 13 } ] // 遍历的属性即对应映射元素的键值对数组}for(let k2 of m.keys()){ console.log(k2); // prop // prop2 // num // 遍历的属性对应映射元素的键}for(let k3 of m.values()){ console.log(k3); // 值 // false // { id: 13 } // 遍历的属性对应映射元素的值}for(let k4 of m[symbol.iterator]()){ console.log(k4); // [ 'prop', '值' ] // [ 'prop2', false ] // [ 'num', { id: 13 } ] // 遍历的属性即对应映射元素的键值对数组}
1-4 与object对比
内存占用浏览器的差异会导致两种存储方式占用的内存占用所不同,不过在给定内存大小的情况下,map比object多存储大约50%的键值对
插入性能插入速度上面 map 和 object性能大致相同, 但是如果代码涉及大量的插入,建议使用map
查找速度差异较小,只包含少量键值对的情况下object更好
删除性能object 的delete()性能较差,而map的删除delete()性能好,如果数据涉及到大量的删除操作,建议使用map
【相关推荐:javascript视频教程、编程视频】
以上就是es6 map是引用类型吗的详细内容。