定义
JavaScript的对象是一种无序的集合数据类型,它由若干键值对组成。写法:
let obj={'name':'frank','age':18}//name 只能是字符串,age 也只能是字符串,就算你把引号删掉,它还是字符串
let obj=new Object({name':'frank'})//这是正规写法,上面那种是简单写法
console.log({'name':'frank','age':18})//这是匿名字符串
注:
1、JavaScript用一个{...}表示一个对象,键值对以xxx: xxx形式申明,用,隔开。注意,最后一个键值对不需要在末尾加,,如果加了,有的浏览器(如低版本的IE)将报错。
2、键名是字符串,不是标识符。键名可以省略引号,但是必须没有特殊字符,例如-。如使用标识符的规则去构建键名,在后续可以直接使用object.prop的形式去访问一个属性。
对象键值易错点
属性名始终是字符串
如果使用一些奇怪的不符合标识符的规则属性名。要始终记录键值名始终是字符串,无论是否键值名是否加了引号,都表示字符串。可以使用Object.keys(obj)可以得到 obj 的所有 key,如下
let obj={
1:'a',
3.2:'b',
1e2:true,
1e-2:true,
.234:true,
0xFF:true
}
Object.key(obj)//可以得到所有的键名(key)
=>["1","100","255","3.2","0.01","0.234"]
变量作属性名
如果需要使用变量做属性名,直接修改属性名为变量名字就可以了吗?答案是否定的,引擎会认为这是一个以变量名命名的键值对。如下
let p1='name'
let obj={p1:'frank'}//这样写,属性名为’p1'
let obj={[p1]:'frank'}//这样写,属性名为'name'
要想使用变量作属性名,需要使用[]提示引擎去变量求值。
对象属性的增删改查
删除属性
由于JavaScript的对象是动态类型,我们可以很自由地使用delete关键字删除属性。delete的基本用法是
delete obj.xxx;
delete obj['xxx'];
//删除一个不存在的属性也不会报错
通常来说delete 只能删属性,如果你要删其它的东西最好不要用 delete。
如果要检测一个对象是否存在某一属性,可以使用in操作符。如下:
var xiaoming = {
name: '小明',
birth: 1990,
school: 'No.1 Middle School',
height: 1.70,
weight: 65,
score: null
};
'name' in xiaoming; // true
'grade' in xiaoming; // false
注:如果in判断一个属性存在,不一定属性该对象,它可能是由该对象通过原型继承得来的。
如果要判断一个属性是否是该对象拥有,使用hasOwnProperty()方法。例如:
var xiaoming = {
name: '小明'
};
xiaoming.hasOwnProperty('name'); // true
xiaoming.hasOwnProperty('toString'); // false
查看属性(读属性)
-
查看对象所有属性的方法 JS常用提供的方法如下 1、查看自身所有属性 Object.keys(obj) 2、查看自身所有值: Object.values(obj) 3、查看自身所有属性和值: Object.entries(obj) 4、查看自身+共有属性 console.dir(obj)或者自己依次用 Object.keys 打印出 obj.proto
-
查看对象单个属性的方法 1、使用类似数组访问的形式进行获取,例如
obj['key']。 2、使用Object.prop的方法获取,例如obj.key。 注:当使用中括号获取单个属性的时候,一定要加单引号。例如obj[key],变量 key 值一般不为'key'.
修改属性(写属性)
- 直接赋值 根据前面的查找属性,找到属性值,然后通过赋值语句直接赋值。例如:
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']
- 批量修改
通过ES6新增的一个API,
Obejct.assign()进行修改。例如
Object.assign(obj,{age:18,gender:'man'})