分享更有价值
被信任是一种快乐

es6的map是有序吗

文章页正文上

本篇内容主要讲解“es6的map是有序吗”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“es6的map是有序吗”吧! map是有序的。ES6中的map类型是一种储存着许多键值对的有序列表,其中的键名和对应的值支持所有数据类型;键名的等价性判断是通过调用“Objext.is()”方法来实现的,所以数字5与字符串“5”会被判定为两种类型,可以分别作为两种独立的键出现在程序中。JavaScript的对象(object),本质是上键值对的集合,但是传统上只能用字符串当做键值对。为了解决这个问题,ES6提供了map数据结构。它类似对象,也是键值对的集合。但是这个键的范围不限于字符串,各种类型的值(包括对象)都可以当做键。也就是说object结构提供了(字符串-值)的对应,map结构实现ES6中的map类型是一种储存着许多键值对的有序列表,其中的键名和对应的值支持所有数据类型。键名的等价性判断是通过调用Objext.is()方法来实现的,所以数字5与字符串‘5’会被判定为两种类型,可以分别作为两种独立的键出现在程序中。注意:有一个例外,map集合中将+0和-0视为相等,与Object.is()结果不同,如果需要“键值对”的数据结构,map比object更合适,具有极快的查找速度1、属性:size返回map的元素数2、基本方法(1)set()给map添加数据,返回添加后的map(给已存在的键赋值后会覆盖掉之前的值)(2)get()获取某个key的值,返回key对应的值,没有则返回undefined(3)has()检测是否存在某个key,返回布尔值

letmap=newMap();

map.set免费云主机、域名('JacksonWang','123');
map.set('LEO','456');
map.set('Z-','789');

console.log(map.size);
console.log(map.get('JacksonWang'));
console.log(map.get('LEO'));
console.log(map.has('Z-'));

//输出:3
//123
//456
//true

(4)delete()删除某个key及其对应的value,返回布尔值,成功删除则为true(5)clear()清除所有的值,返回undefined

letmap=newMap();

map.set('JacksonWang','123');
map.set('LEO','456');
map.set('Z-','789');

map.delete('Z-');
console.log(map.size);

console.log(map.clear())

//输出:2
//undefined

3、遍历方式注意:map的遍历顺序就是插入顺序(1)keys()获取map的所有key(2)values()获取map的所有值(3)entries()获取map的所有成员

letmap=newMap();

map.set('JacksonWang','123');
map.set('LEO','456');
map.set('Z-','789');

console.log(map.keys())//打印所有的键
console.log(map.values())//打印所有的值
console.log(map.entries())//以键值对的方式

/*输出:
[MapIterator]{'JacksonWang','LEO','Z-'}
[MapIterator]{'123','456','789'}
[MapEntries]{
['JacksonWang','123'],
['LEO','456'],
['Z-','789']
}*/

(4)forEach()遍历map的所有成员

letmap=newMap();

map.set('JacksonWang','123');
map.set('LEO','456');
map.set('Z-','789');

for(const[key,value]ofmap.entries()){
console.log(`${key}:${value}`);
}
/*输出:
JacksonWang:123
LEO:456
Z-:789
*/

4、转为数组map结构转为数组解构

letmap1=newMap([
[1,'One'],
[2,'Two'],
[3,'Three']
])

console.log([...map1.keys()]);
console.log(...map1.entries())
console.log([...map1.entries()]);

/*输出:
[1,2,3]
[1,'One'][2,'Two'][3,'Three']
[[1,'One'],[2,'Two'],[3,'Three']]
*/

WeakMap是弱引用Map集合,也用于存储对象的弱引用。WeakMap集合中的键名必须是一个对象,如果使用非对象键名会报错:集合中保存的是这些对象的弱引用,如果在弱引用之外的不存在其他的强引用,引擎的垃圾回收机制会自动回收这个对象,同时会移出WeakMap集合中的键值对。但是只有集合的键名遵循这个规则,键名对应的值如果是一个对象,则保存的对象的强引用,不会触发垃圾回收装置1、WeakMap集合的用途(1)存储DOM元素

html>





Document

代码中的myElement是一个DOM节点,每当发生click事件,就更新一下状态。我们将这个状态作为键值放在WeakMap里,对应的键名就是myElement,一旦这个DOM节点删除,该状态就会自动消失,不存在内存泄漏的风险 (2)注册监听事件的listener对象

html>





Document

所体现的效果是一样的(3)部署私有属性

functionPerson(name){
this._name=name;
}

Person.prototype.getName=function(){
returnthis._name;
}
//但这是,创建一个Person对象的时候,我们可以直接访问name
letp=newPerson('张三');
console.log(p._name)

//输出:张三

我们不想让用户直接访问name属性,直接使用下面的方法将name包装成私有属性

letPerson=(function(){
letprivateData=newWeakMap();
functionPerson(yourname){
privateData.set(this,{_name:yourname})//this当前这个键的对象
}
Person.prototype.getName=function(){
returnprivateData.get(this)._name;//
}
returnPerson;
})();//定义好了函数就开始执行

letp=newPerson('jack');
console.log(p._name)//因为name的私有型,所以在外不可访问
console.log(p.getName())

/*输出:
undefined
jack
*/

到此,相信大家对“es6的map是有序吗”有了更深的了解,不妨来实际操作一番吧!这里是云技术网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

相关推荐: es6中的类似于for循环怎么用

这篇文章主要介绍“es6中的类似于for循环怎么用”,在日常操作中,相信很多人在es6中的类似于for循环怎么用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”es6中的类似于for循环怎么用”的疑惑有所帮助!接下来,请跟着小编一…

文章页内容下
赞(0) 打赏
版权声明:本站采用知识共享、学习交流,不允许用于商业用途;文章由发布者自行承担一切责任,与本站无关。
文章页正文下
文章页评论上

云服务器、web空间可免费试用

宝塔面板主机、支持php,mysql等,SSL部署;安全高速企业专供99.999%稳定,另有高防主机、不限制内容等类型,具体可咨询QQ:360163164,Tel同微信:18905205712

主机选购导航云服务器试用

登录

找回密码

注册