JS 对象基本用法

107 阅读2分钟

1、声明对象的两种语法

简写方法 let obj = {'name': 'frank', 'age': 18}

标准写法 let obj = new Object({'name': 'frank'})

2、如何删除对象的属性

delete obj.xxx 或 delete obj['xxx']

以上代码删除的是属性名和属性值

判断不含属性名 'xxx' in obj === false

含有属性名,但其值为undefined 'xxx' in obj && obj.xxx === undefined

注意,obj.xxx === undefined 不能判断'xxx'是否为obj的属性

只删除属性值,保留属性名使用以下代码

obj.name = undefined

3、如何查看对象的属性(查看属性就是读属性)

  • 中括号语法:obj['key']
  • 点语法:obj.key // 其中key为字符串'key',等价于中括号语法,不等价于以下坑新人语法
  • 坑新人语法:obj[key] // 其中key为变量, 值一般不为 'key'

注意!

let name = 'key'
obj[name]

以上代码才等价于 obj['key']

查看所有属性的方法

Object.keys(obj) // 查看key值
Object.values(obj) // 查看value值
Object.entries(obj) // 查看所有key值、value值
console.dir(obj) // 以目录形式查看自身属性+共有属性
obj.__proto__  // 打印出这个隐藏属性,但是不推荐,因为不规范

4、如何修改或增加对象的属性

修改或增加“自身属性”

let obj = {name:'poyap'}
obj.name = 'poyap'  // 方式1

obj['name'] = 'poyap' // 方式2

obj['na'+'me'] = 'poyap' // 方式3

let key = 'name'
obj[key] = 'poyap' // 方式4

如果需要批量赋值,使用以下代码,例如赋值1/2/3

Object.assign(obj, {p1: 1, p2: 2, p3: 3})

修改或增加“共有属性”

注意:

  • 修改或增加只能写“自身属性”,无法通过自身修改或增加“共有属性”,方法为:
let obj = {}, obj2 = {} // 共有 toString
obj.toString = 'xxx' 只会改 obj 自身属性
obj2.toString 还是在原型上

如果一定要修改或增加原型上的属性,方法为:

obj.__proto__.toString='xxx' // 所有"__proto__"均不推荐使用
Object.pototype.toString='xxx' // 推荐使用

注意:一般不要修改原型,会引起非常多的问题

修改隐藏属性

方法 一(不推荐) :

let obj = {name:'poyap'}
let obj2 = {name: 'jack'}
let common = {kind: 'human'}
obj.__proto__ = common
obj2.__proto__ = common // 此方法因为__proto__不推荐使用

方法 二(推荐) :

let obj = Object.create(common) // 以common对象为原型创建obj
obj.name = 'poyap'
let obj2 = Object.create(common)
obj2.name = 'jack'

5、'name' in obj和obj.hasOwnProperty('name') 的区别

'name' in obj

  • 属性名作为字符串,判断obj对象是否含有name属性,如果含有,自身属性和共有属性都返回true

obj.hasOwnProperty('name')

  • 判断name属性是否obj自身还是共有,判断为自身属性返回true,否则为false