JS中Map对象与object的区别

本文介绍了ES6中的Map对象与Object在数据存储、key类型、顺序、创建方式、访问和设置属性以及size属性上的区别。Map允许更广泛的数据类型作为key,且顺序基于声明而非使用,提供了更灵活的选项。
摘要由CSDN通过智能技术生成

若想了解Map对象可以阅读本人这篇ES6初步了解Map
Map对象与object有什么区别?让我为大家介绍一下吧!

共同点

二者都是以key-value的形式对数据进行存储

		const obj = {
            name:"zs",
            age:18
        }
        console.log(obj)
        let m = new Map()
        m.set("name","zs")
        m.set("age",18)
        console.log(m)

在这里插入图片描述

不同点

1.key的数据类型范围不同,obj可以作为key的仅有number、string、symbol,map均可以

		const obj = {
            name:"zs",
            age:18,
            [Symbol("11")]:"22"
        }
        console.log(obj)
        let m = new Map()
        m.set("name","zs")
        m.set("age",18)
        m.set(Symbol("11"),22)
        m.set([1,2,3],33)
        m.set({},33)
        console.log(m)

在这里插入图片描述
2.key的顺序不同,obj通过obj.keys()打印出来的属性顺序是 number–字符串,map的key顺序是声明顺序。
在这里插入图片描述

在这里插入图片描述
3.创建方式不同。obj有三种创建方式 字面量{}、new Object() 、构造函数。map仅支持new Map()
obj的创建方式:

        const obj = {
            name:"zs",
            age:18
        }
        console.log(obj)
        // 2.new Object
        let obj1 = new Object()
        console.log(obj1)
        // 3.构造函数
        function Person(name,age){
            this.name = name
            this.age = age
        }
        let obj2 = new Person("zs",18)
        console.log(obj2)

在这里插入图片描述
Map对象的创建方式:

let m = new Map()

在这里插入图片描述
4. key的调用不同。 map只能用原生的get方法调用。

        const obj = {
            name:"zs"
        }
        console.log(obj["name"]) //zs
        let m = new Map()
        m.set("name","ls")
        console.log(m.get("name")) //ls

5.设置属性的方式不同。map只能使用set(key,val)方法设置属性。

		const obj = {}
        obj["name"] = "zs"
        console.log(obj)
        let m = new Map()
        m.set("name","ls")
        console.log(m)

在这里插入图片描述

6.Size属性。map有size属性,对象没有。Map.size 返回 Map 中元素的数量,而 Object 的键值对个数只能手动计算

        let m = new Map()
        m.set("name","ls")
        m.set("age",18)
        console.log(m.size) //2

感谢大家的阅读,如有不对的地方,可以向我提出,感谢大家!

  • 6
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值