最新公告
  • 欢迎您光临起源地模板网,本站秉承服务宗旨 履行“站长”责任,销售只是起点 服务永无止境!立即加入钻石VIP
  • JS数据类型--object(上)

    正文概述 掘金(长街千堆雪)   2021-01-03   663

    object(唯一一种复杂类型)

    一、定义:

    无序的数据集合

    建制对的集合

    二、写法:

    • 简便写法:let obj = { 'name': 'frank', 'age': 18 }
    • 正规写法:let obj = new Object({'name': 'frank'})
    • 匿名写法:console.log({ 'name': 'frank, 'age': 18 })
    注意:
    • 键名是字符串!
    • 键名是字符串,不是标识符,可以包含任意字符
    • 引号可省略,省略之后就只能写标识符
    • 渲算引号省略了,键名也还是字符串(重要)

    三、对象的属性

    • 属性名:每个key都是对象的属性名(property)
    • 属性值:每个 value 都是对象的属性值

    1、奇怪的属性名:

    所有属性名都会自动变成字符串

    let obj = {
      1: 'a',
      3.2: 'b',
      1e2: true,
      1e-2: true,
      .234: true,
      0xFF: true
    };
    /** 以上每个属性的key值:
    1其实是'1'
    3.2其实是是'3.2'
    1e2其实是'100'
    1e-2其实是'0.01'
    .234其实是'0.234'
    0xFF其实是'255'
    

    Object.keys(obj) 可以得到obj的所有key

    2、变量做属性名:

    如何使用变量做属性名?之前都是常量做属性名

    let p1 = 'name'
    let obj = { p1 : 'frank'} //这样写,属性名为 'p1'
    let obj = { [p1] : 'frank' } //这样写,属性名为 'name'
    
    • 不加 [ ] 的属性名会自动变成字符串。
    • 加了 [ ] 则会当做变量求值。
    • 值如果不是字符串,则会自动变成字符串

    3、对象的隐藏属性:

    • JS中每个对象都有一个隐藏属性__proto__
    • 这个隐藏属性储存着其共有属性组成的对象的地址
    • 这个由共有属性组成的对象window.Object.prototype叫做原型,也称为对象的根
    • 也就是说,每个object对象的隐藏属性__proto__储存着原型window.Object.prototype的地址
    • 每个对象都有原型
    • 原型也是个对象,所以也有原型,这不过原型的原型为null(空,但是是存在的)
    var obj= {}obj.toString() //居然不报错              
    //因为obj的隐藏属性对应的对象上有toString()
    

    四、对象属性的增删改查

    1、删除属性

    delete obj.xxxdelete obj['xxx']:即可删除obj的XXX属性,此时属性值当然也没有 注意比较区别:obj.xxx = undifined xxx属性名还在,只是属性值变为undifined

    举例:

    (1)

    JS数据类型--object(上)

    注:只能用'xxx' in obj 查看属性名是否还在对象中:true表示在,false表示不在

    (2)

    JS数据类型--object(上)

    ①语句'xxx' in obj && obj.xxx === undefined返回true,表示属性xxx还在obj中,而且属性xxx的值是undefined

    ②注意obj.xxx === undefined不能断定'xxx' 是否为obj的属性。

    2、读属性

    查看一个对象的所有属性:

    • 查看一个对象的所有自身属性: Object.keys(obj)
    • 查看一个对象的所有自身属性值: Object.values(obj)
    • 查看一个对象的所有自身的属性和值:直接对象名就行obj或者Object.entries(obj)
    • 查看自身+共有属性: console.dir(obj)
    • 查看共有属性: 自己依次用Object.keys打印出obj.__ proto_
    • 判断一个属性是自身的还是共有的: obj.hasOwnProperty('属性名')( 返回true说明该属性是自身属性,返回false说明该属性是共有属性)
    • 'key' in obj查看属性名是否还在对象中:true表示在,false表示不在

    查看一个对象的一个属性

    • 中括号语法: obj['key']obj['k'+'ey']
    • 点语法: obj.key
    • 坑新人语法:obj[key] // 变量 key 值一般不为 'key'

    举例

    let list = ['name','age','gender']
    let person = {
        name: 'yy', age : 18, gender : 'woman'
    }
    for (let i = 0; i < list.length; i++) {
        let name = list [i]
        console.log(person.name)  //重点
    }
    // 结果为person的第一个属性值yy*3
    
    let list = ['name','age','gender']
    let person = {
        name: 'yy', age : 18, gender : 'woman'
    }
    for (let i = 0; i < list.length; i++) {
        let name = list [i]
        console.log(person[name]) //重点
    }
    // 结果为person的所有属性值yy、18、woman
    

    3、写属性

    1、修改或增加属性

    (1)直接赋值

    let obj = {name: 'frank'} // name 是字符串
    obj.name = 'frank' // name 是字符串
    obj['name'] = 'frank'
    ***obj[name] = 'frank' // 错,因 name 值不确定
    obj['na'+'me'] = 'frank'
    let key = 'name'; obj[key] = 'frank'
    let key = 'name'; ***obj.key = 'frank'~~ // 错,因为 obj.key 等价于 obj['key']
    

    (2)批量赋值

    Object.assign(obj, {age: 18, gender: 'man'})
    

    2、修改或增加公有属性

    无法通过自身修改或增加共有属性

    • let obj = {}, obj2 = {} 共有 toString
    • obj.toString = 'xxx' 只会在改 obj 自身属性
    • obj2.toString 还是在原型上

    我偏要修改或增加原型上的属性

    • obj.__proto__.toString = 'xxx' // 不推荐用 __proto__

    • Object.prototype.toString = 'xxx'

    • 一般来说,不要修改原型,会引起很多问题

    3、修改隐藏属性

    不推荐使用__proto__

    let obj = {name:'frank'}
    let obj2 = {name: 'jack'}
    let common = {kind: 'human'}
    obj.__proto__ = common
    obj2.__proto__ = common
    
    

    推荐使用 Object.create

    let obj = Object.create(common)
    obj.name = 'frank'
    let obj2 = Object.create(common)
    obj2.name = 'jack'
    

    规范大概的意思是,要改就一开始就改,别后来再改

    本章总结

    delete obj['name']
    'name' in obj // false
    obj.hasOwnProperty('name')  // false
    

    Object.keys(obj)
    console.dir(obj)
    obj['name']
    obj.name // 记住这里的 name 是字符串
    obj[name]  // 记住这里的 name 是变量
    

    • 改自身 obj['name'] = 'jack'
    • 批量改自身 Object.assign(obj, {age:18, ...})
    • 改共有属性 obj.__proto__['toString'] = 'xxx'
    • 改共有属性 Object.prototype['toString'] = 'xxx'
    • 改原型 obj.__proto__ = common
    • 改原型 let obj = Object.create(common)

    注:所有__proto__代码都是强烈不推荐写的

    • 基本同上:已有属性则改;没有属性则增

    起源地下载网 » JS数据类型--object(上)

    常见问题FAQ

    免费下载或者VIP会员专享资源能否直接商用?
    本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。更多说明请参考 VIP介绍。
    提示下载完但解压或打开不了?
    最常见的情况是下载不完整: 可对比下载完压缩包的与网盘上的容量,若小于网盘提示的容量则是这个原因。这是浏览器下载的bug,建议用百度网盘软件或迅雷下载。若排除这种情况,可在对应资源底部留言,或 联络我们.。
    找不到素材资源介绍文章里的示例图片?
    对于PPT,KEY,Mockups,APP,网页模版等类型的素材,文章内用于介绍的图片通常并不包含在对应可供下载素材包内。这些相关商业图片需另外购买,且本站不负责(也没有办法)找到出处。 同样地一些字体文件也是这种情况,但部分素材会在素材包内有一份字体下载链接清单。
    模板不会安装或需要功能定制以及二次开发?
    请QQ联系我们

    发表评论

    还没有评论,快来抢沙发吧!

    如需帝国cms功能定制以及二次开发请联系我们

    联系作者

    请选择支付方式

    ×
    迅虎支付宝
    迅虎微信
    支付宝当面付
    余额支付
    ×
    微信扫码支付 0 元