声明对象的两种语法
let obj = {'name': 'frank', 'age': 18}
let obj = new Object({'name': 'frank'})
// 第二种语法正规,但第一种语法更常用
如何删除对象的属性
delete obj.xxx 或 delete obj['xxx']
var obj = {name: 'frank', age: 18}
// 终端输出 undefined
var obj2 = {name: 'frank', age: 18}
// 终端输出 undefined
delete obj.name
// 终端输出 true
obj
// 终端输出 {age: 18}
delete obj2['name']
// 终端输出 true
'name' in obj2
// 终端输出 false
'age' in obj2
// 终端输出 true
如何查看对象的属性
-
查看自身所有属性 object.keys(obj)
-
查看自身+共有属性 console.dir(obj) 或者自己依次用 Object.keys 打印出 obj.__proto__
-
判断一个属性是自身的还是共有的 obj.hasOwnProperty('toString')
var obj2 = {name: 'frank', age: 18}
// 终端输出 undefined
Object.keys(obj2)
// 终端输出 (2) ["name", "age"]
Object.values(obj2)
// 终端输出 (2) ["frank", 18]
obj2
// 终端输出 {name: "frank", age: 18}
Object.entries(obj2)
// 终端输出
// (2) [Array(2), Array(2)]
// 0: (2) ["name", "frank"]
// 1: (2) ["age", 18]
// length: 2
// __proto__: Array(0)
console.dir(obj2)
// 终端输出 Object
// age: 18
// name: "frank"
// __proto__:
// constructor: ƒ Object()
// hasOwnProperty: ƒ hasOwnProperty()
// isPrototypeOf: ƒ isPrototypeOf()
// propertyIsEnumerable: ƒ propertyIsEnumerable()
// toLocaleString: ƒ toLocaleString()
// toString: ƒ toString()
// valueOf: ƒ valueOf()
// __defineGetter__: ƒ __defineGetter__()
// __defineSetter__: ƒ __defineSetter__()
// __lookupGetter__: ƒ __lookupGetter__()
// __lookupSetter__: ƒ __lookupSetter__()
// get __proto__: ƒ __proto__()
// set __proto__: ƒ __proto__()
obj2.__proto__
// 终端输出
// {constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}
'toString' in obj2
// 终端输出 true
obj2.hasOwnProperty('toString')
// 终端输出 false
obj2.hasOwnProperty('name')
// 终端输出 true
原型
每个对象都有原型
- 原型里存着对象的共有属性
- 比如 obj 的原型就算一个对象
- obj.__proto__ 存着这个对象的地址
- 这个对象里有 toString / constructor / valueOf 等属性
对象的原型也是对象
- 所以对象的原型也有原型
- obj={} 的原型即为所有对象的原型
- 这个原型包含所有对象的共有属性,是对象的根
- 这个原型也有原型,是 null
查看属性
两种方法查看属性
- 中括号语法:obj['key']
- 点语法: obj.key
- 坑新人语法: obj[key] // 变量 key 值一般部位 'key'
请优先使用中括号语法
- 点语法会误导你,让你以为 key 不是字符串
- 等你确定不会弄混两种语法,再改用点语法
var obj = {name: 'frank', age: 18}
// 终端输出 undefined
obj['name']
// 终端输出 "frank"
obj.name
// 终端输出 "frank"
obj[name]
// 终端输出 undefined
name
// 终端输出 ""
window.name = 'age'
// 终端输出 "age"
obj[name]
// 终端输出 18
obj['na' + 'me']
// 终端输出 "frank"
obj[console.log('name')]
// 终端打印 name
// 终端输出 undefined
obj['undefined']
// 终端输出 undefined
obj.name
// 等价于
obj['name']
obj.name
// 不等价于
obj[name]
// 简单来说,这里的 name 是字符串,而不是变量
let name = 'frank'
obj[name]
// 等价于
obj['frank']
如何修改或增加对象的属性
直接赋值
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']
批量赋值
Object.assign(obj, {age: 18, gender: 'man'})
修改或增加共有属性
- 无法通过自身修改或增加共有属性
let obj = {}, obj2 = {} // 共有 toString
obj.toString = 'xxx' // 只会在改 obj 自身属性
obj2.toString // 还是在原型上
- 我偏要修改或增加原型上的属性
obj.__proto__.toString = 'xxx' // 不推荐用 __proto__
Object.prototype.toString = 'xxx'
// 一般来说,不要修改原型,会引起很多问题
let obj = {}, obj2 = {}
obj.__proto__.toString = 'xxx'
// 终端上输出 "xxx"
obj2.toString
// 终端上输出 "xxx"
// 这样做修改原型,比较危险,会让原型混乱
修改隐藏属性
- 不推荐使用 __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'
// 规范大概的意思是,要改就一开始就改,别后来再改
obj = {name: 'jack', age: 18, gender: '男'}
// 终端上输出 {name: "jack", age: 18, gender: "男"}
obj.__proto__ = null
// 终端上输出 null
obj
// 终端上输出
// {name: "jack", age: 18, gender: "男"}
// age: 18
// gender: "男"
// name: "jack"
// obj 没有了 __proto__
obj.valueOf
// 终端上输出 undefined
总结:
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__ 代码都是强烈不推荐写的
'name' in obj和obj.hasOwnProperty('name') 的区别
var obj = {}
// 终端上输出 undefined
obj.name = 'frank'
// 终端上输出 "frank"
'name' in obj
// 终端上输出 true
obj.hasOwnProperty('name')
// 终端上输出 true
'toString' in obj
// 终端上输出 true
obj.hasOwnProperty('toString')
// 终端上输出 false
in 语法是判断属性是否在自身属性或共有属性上
hasOwnProperty 是只有在自身属性上时候,才返回 true