ES6 Map结构的应用实例分析
本文实例讲述了ES6Map结构的应用。分享给大家供大家参考,具体如下:
Map数据结构类似于对象,也是键值对的集合,但是“键”的范围不限于字符串,各种类型的值(包括对象)都可以当作键。也就是说,Object结构提供了“字符串—值”的对应,Map结构提供了“任何—值”的对应,是一种更完善的Hash结构实现。如果你需要“键值对”的数据结构,Map比Object更合适。
初识map
varobj={ 'name':'Joh', qq:'5222', 'fullname':'Johnny' }; letmap=newMap(); map .set(obj,'Hellomap') .set('haha',12) .set(52,obj) .set(NaN,newSet([1,2,3])); console.log(map); console.log(map.size);//4
Map可以连续set,就像Set可以连续add一样,同样有size的api
map的delete,has方法
varobj={ 'name':'Joh', qq:'5222', 'fullname':'Johnny' }; vararr=[1,2]; letmap=newMap(); //map可以连续set map .set(obj,'11') .set(11,3) .set(12,'H') .set(arr,'h'); vardelRes=map.delete(obj);//map不可以连续delete console.log(delRes);//true varhasBool1=map.has(11); console.log(hasBool1);//true varhasBool2=map.has(arr); console.log(hasBool2);//true console.log(map.size);//3
NaN在map上的特殊性与clear方法
letmap=newMap(); //map可以连续set map .set(11,3) .set(12,'H') .set(NaN,'h1') .set(NaN,'h2');//覆盖前值 console.log(map.get(NaN));//h2 map.clear(); console.log(map.size);//0
和set相同,NaN在map上具有唯一性,clear方法会将集合清空
map的构造函数参数的传递,取值get方法,keys方法,values方法
letmap=newMap([ ['name','Joh'], ['age',10] ]); letname=map.get('name'); letage=map.get('age'); console.log(name);//Joh console.log(age);//10 letkeys=map.keys(); for(letkofkeys){ console.log(k);//分别输出name和age } letvalues=map.values(); for(letvofvalues){ console.log(v);//分别输出Joh和10 }
map与set的原型属性比较和map使用entries方法获得数据的实体
letmap=newMap([ ['name','Joh'], ['age',10] ]); console.log(Set.prototype[Symbol.iterator]===Set.prototype.values);//true console.log(Map.prototype[Symbol.iterator]===Map.prototype.values);//false console.log(Map.prototype[Symbol.iterator]===Map.prototype.entries);//true letentries=map.entries(); for(letenofentries){ console.log(en);//分别输出['name','Joh']和['age',10] }
map内forEach方法和对象传递,以及内部this的使用
letmap=newMap([ ['name','Joh'], ['age',10] ]); varme={ name:"Joh" }; map.forEach(function(val,key){ console.log(key,val);//分别输出nameJoh和"age"10 }); console.log('>>>>>'); map.forEach(function(val,key){ //console.log(key,val);//分别输出nameJoh和"age"10 console.log(this);//{name:"Joh"}此处的this就是传递进来的对象 },me);
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript数组操作技巧总结》、《JavaScript排序算法总结》、《JavaScript数学运算用法总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript查找算法技巧总结》及《JavaScript错误与调试技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。