前端学习日记-JS对象

对象

定义

• 无序的数据集合
• 键值对的集合

写法

let obj = {'name':'frank','age':18}
let obj = new Object({'name':'frank'})
console.log({'name':'frank','age':18})

细节

• 键名是字符串，不是标识符，可以包含任意字符
• 引号可省略，省略之后就只能写标识符
• 就算引号省略了，键名还是字符串

---

属性名

每个key都是对象的属性名（property）

属性值

每个value都是对象的属性值

奇怪的属性名

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

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

变量作属性名 [ ]

• let p1 = ‘name’
• let obj = {p1:‘frank’} 属性名为‘p1’
• let obj = {[p1]:‘frank’} 属性名为’name’
• 不加[ ]的属性名会自动变成字符串
• 加了[ ]则会当作变量求值
• 值如果不是字符串，则会自动变成字符串

---

对象的隐藏属性

• JS中每一个对象都有一个隐藏属性
• 这个隐藏属性存储着其共有属性组成的对象的地址
• 这个共有属性组成的对象叫做原型
• 也就是说，隐藏属性存储着原型的地址

代码示例：

• var obj = {}
• obj.toString() //不会报错
• 因为obj的隐藏属性对应的对象上有toString（）

---

除了字符串，symbol也能做属性名

---

增删改查

删除属性

delete obj.xxx 或 delete obj[‘xxx’]

• 即可删除obj的xxx属性
• 请区分属性值为undefined和不含属性名

不含属性名

• ‘xxx’ in obj === false

含有属性名，但是值为undefined

• ‘xxx’ in obj && obj.xxx === undefined

注意obj.xxx === undefined

• 不能断定’xxx’是否为obj的属性

---

读属性

查看自身所有属性

• Object.keys(obj)

查看自身+共有属性

• console.dir(obj)
• 或者自己依次用Object.keys打印出obj.__proto__可

判断一个属性是自身的还是共有的

• obj.hasOwnProperty(‘toString’)

原型

每个对象都有原型

• 原型里存着对象的共有属性
• 比如obj的原型就是一个对象
• obj.__proto__存着这个对象的地址
• 这个对象里有toString/constructor/valueOf等属性

对象的原型也是对象

• 所以对象的原型也有原型
• obj={ }的原型即为所有对象的原型
• 这个原型包含所有对象的共有属性，是对象的根
• 这个原型也有原型，是null

查看属性

两种方法查看属性

• 中括号语法：obj[‘key’] //优先使用
• 点语法： obj.key
• 坑新人语法： obj[key] //变量key值一般不为’key‘

obj.name 等价于 obj[‘name’]
obj.name 不等价于 obj[name]
简单来说，这里的name是字符串，而不是变量

let name = ’frank‘
obj[name] 等价于 obj[‘frank’]而不是obj[‘name’]和obj.name

---

写属性

直接赋值

• let obj ={name:‘frank’} //name是字符串
• obj.name = ‘frank’ //name是字符串
• obj[‘name’] = ‘frank’
• obj[‘na’+‘me’] = ‘frank’
• let key =‘name’ ; obj[key] = ‘frank’ ;
• obj.key等价于obj[‘key’]

修改或增加共有属性

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

---

’name’ in obj和obj.hasOwnProperty(‘name’) 的区别

• 使用in判断对象中是否由属性时，若自身没有，在原型中找到也是返回true
• 使用hasOwnproperty()判断对象是否含有属性时，只有自身有才后悔返回true