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程序设计有所帮助。