1. 声明对象的两种语法
- 简单写法
let obj = {'name': 'frank', 'age': 18}
- 正规写法
let obj = new Object ({'name':'frank'})
- 要点
'name'和'age'是键名key，不是标识符，可以包含任意字符；引号可以省略，但是省略之后就只能写标识符（不能写数字开头）；就算引号省略了，键名key还是字符串。'frank'和18是key的value。- 每个key都是对象的属性名（property），每个value都是对象的值。
- 注意
- JS会把所有属性名自动编程字符串
let obj = {1:'a', 3.2:'b', 1e2:true, 1e-2:true, .234:true, 0xFF:true};
Object.keys(obj) //输出结果如下
{1: "a", 100: true, 255: true, 3.2: "b", 0.01: true, 0.234: true}
Object.keys(obj) //可以得到obj的所有key如下
(6) ["1", "100", "255", "3.2", "0.01", "0.234"]
0: "1"
1: "100"
2: "255"
3: "3.2"
4: "0.01"
5: "0.234"
length: 6
- 如何用变量做属性名
let p1 = 'name'
let obj = {p1:'frank'} //这样写属性名是'p1'
let obj = {[p1]:'frank'} //这样写属性名是'name'
注意：
(1) 不加[]的属性名会自动变成字符串；
(2) 加了[]则会当作变量求值；
(3) 值如果不是字符串，则会自动变成字符串。
- 对象的隐藏属性: JS中的每个对象都有一个隐藏属性，该属性存储着其共有属性组成的对象的地址，这个共有属性组成的对象叫做原型；也就是说，隐藏属性存储着原型的地址。
2. 删除对象的属性
- 直接删除
delete obj.xxx 或 delete obj['xxx']
- 令属性名为undefined
obj.xxx = undefined
- 区别
let obj = {'name':'frank', 'age':18}
delete obj.name //删除了name的属性名和属性，
obj.age = undefined //删除了age的属性，使之为undefined，但是age属性仍然存在
//此时查看obj的属性，只有age且age的属性为undefined
obj
{age: undefined}
- 查询对象是否已删除
'name' in obj //返回的是false，说明'name'已经不在obj里，'name'属性已被删除
'age' in obj //返回的是true，说明'age'仍在obj里，'age'属性没有被删除
3. 查看对象的属性
- 查看自身所有属性
let obj = {'name':'frank', 'age':18}
Object.keys(obj) //查看如下自身所有属性
(2) ["name", "age"]
0: "name"
1: "age"
length: 2
__proto__: Array(0)
- 查看自身属性和共有属性
let obj = {'name':'frank', 'age':18}
console.dir(obj) //查看到如下属性,点开最后一行__proto__可以查看共有属性
Object
age:18
name:"frank"
__proto__: Object
- 判断一个属性是自身的还是共有的
let obj = {'name':'frank', 'age':18}
obj.hasOwnProperty('name') //查看name是否是obj的自身属性
true //返回的是true，说明name是自身属性
obj.hasOwnProperty('toString') //查看toString是否是obj的自身属性
false //返回的是false，说明toString不是自身属性
4. 修改或增加对象的属性
- 直接赋值
let obj = {name:'frank'}
obj.name = 'frank'
obj['name'] = 'frank' //这三种都可以
obj['na'+'me'] = 'frank'
let key = 'name'; obj[key] = 'frank' //这两种也可以
- 批量赋值
let obj = {name:'xiaoming', hometown:'Shanghai', district:'Pudong'}
Object.assign(obj, {age:20, hobby:'basketball'}) //批量添加属性
console.dir(obj) //可查看添加的属性
Object.assign(obj, {age:50, hobby:'videogame',district:'Xuhui'}) //批量修改属性
console.dir(obj) //可查看添加的属性
- 修改或增加
- 修改和增加的操作差不多，如果无中生有，就是增加；如果本来存在，就是修改;
- 原型也是对象，也可以被修改，但是修改原型会引起很多问题，所以不要修改原型。
5. 'name' in obj和obj.hasOwnProperty('name')的区别
let obj = {'name':'frank', 'age':18}
obj.hasOwnProperty('name') //上文提到，用于查看name是否是obj的自身属性
true //返回值为true代表name是obj的自身属性
'name' in obj //用于查看name是否是obj的属性，返回值为true代表
true //返回值为true代表name是obj的属性，不一定是自身属性,不信你看⬇️
'toString' in obj //toString的返回值也是true，toString是共有属性，这就是区别
true
