一文说明JavaScript的Map对象和普通对象的核心区别是什么

Admin 2023-04-10 群英技术资讯 466 次浏览

这篇文章主要讲解了“一文说明JavaScript的Map对象和普通对象的核心区别是什么”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“一文说明JavaScript的Map对象和普通对象的核心区别是什么”吧!

目录
  • JS中的Map对象
  • JS中Map和普通对象
    • Map对象
    • Object对象
    • Objects 和 maps 的比较
  • 总结

    JS中的Map对象

    1.js创建map对象

    var map = new Map();

    2.将键值对放入map对象

    map.set("key",value)
    map.set("key1",value1)
    map.set("key2",value2)

    3.根据key获取map值

    map.get(key)

    4.删除map指定对象

    delete map[key]

    map.delete(key)

    5.循环遍历map

    map.forEach(function(key){
      console.log("key",key)  //输出的是map中的value值
    })

    JS中Map和普通对象

    Map对象

    Map 对象保存键值对。任何值(对象,数组,字符串,数值,布尔,null,undefined) 都可以作为一个键或一个值。

    一个Map对象在迭代时会根据对象中元素的插入顺序来进行 — 一个 for...of 循环在每次迭代后会返回一个形式为[key,value]的数组。

    Object对象

    Object 构造函数创建一个对象包装器。内容为成对的名称(字符串)与值(任何值),其中名称通过冒号与值分隔。

    Objects 和 maps 的比较

    Objects 和 Maps 类似的是,它们都允许你按键存取一个值、删除键、检测一个键是否绑定了值。因此(并且也没有其他内建的替代方式了)过去我们一直都把对象当成 Maps 使用。不过 Maps 和 Objects 有一些重要的区别,在下列情况里使用 Map 会是更好的选择:

    Map Object
    意外的键 Map 默认情况不包含任何键。只包含显式插入的键。 一个 Object 有一个原型, 原型链上的键名有可能和你自己在对象上的设置的键名产生冲突。注意: 虽然 ES5 开始可以用 Object.create(null) 来创建一个没有原型的对象,但是这种用法不太常见。
    键的类型 一个 Map的键可以是任意值,包括函数、对象或任意基本类型。 一个Object 的键必须是一个 String 或是Symbol。
    键的顺序 Map 中的 key 是有序的。因此,当迭代的时候,一个 Map 对象以插入的顺序返回键值。 一个 Object 的键是无序的注意:自ECMAScript 2015规范以来,对象确实保留了字符串和Symbol键的创建顺序; 因此,在只有字符串键的对象上进行迭代将按插入顺序产生键。
    Size Map 的键值对个数可以轻易地通过size 属性获取 Object 的键值对个数只能手动计算
    迭代 Map 是 iterable 的,所以可以直接被迭代。 迭代一个Object需要以某种方式获取它的键然后才能迭代。
    性能 在频繁增删键值对的场景下表现更好。 在频繁添加和删除键值对的场景下未作出优化。

    关于“一文说明JavaScript的Map对象和普通对象的核心区别是什么”就介绍到这了,如果大家觉得不错可以参考了解看看,如果想要了解更多,欢迎关注群英网络,小编每天都会为大家更新不同的知识。 群英智防CDN,智能加速解决方案
    标签: JS中的Map对象

    免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。

    猜你喜欢

    成为群英会员,开启智能安全云计算之旅

    立即注册
    专业资深工程师驻守
    7X24小时快速响应
    一站式无忧技术支持
    免费备案服务
    免费拨打  400-678-4567
    免费拨打  400-678-4567 免费拨打 400-678-4567 或 0668-2555555
    在线客服
    微信公众号
    返回顶部
    返回顶部 返回顶部
    在线客服
    在线客服