对象的属性指对象的成员。讲解属性之前介绍一下Object对象,Object对象是所有JavaScript对象的超类(基类)。本文将会使用到Object对象的一些方法。
属性分类
1. 属性可分为自有属性和继承属性
对象中的属性,根据是否子属于自身的可分为自有属性和继承属性。
① 自有属性:也可叫实例属性;指对象自身的属性,上述的p1对象中的姓名、年龄等都是自有属性。
② 继承属性:也可叫原型属性;指对象从原型中继承的属性。
我们通过在控制台输出p1来看一下:
2. 可分为属性和方法
上文说了,当属性值是函数的时候,该属性可以成为方法,简单来说方法就是一种特殊的属性。
3.可枚举属性和不可枚举属性
可以使用for/in循环对象的可枚举属性,下面我用Object对象的defineProperty方法为上面的p1对象增加一个不可枚举属性x
Object.defineProperty(p1,'x',{
value:'x',
enumerable:false
});
console.log(Object.getOwnPropertyDescriptor(p1, 'x')); //{value: "x", writable: false, enumerable: false, configurable: false}
for(var key in p1) {
console.log(key); //不会打印出x,x属性不可枚举
}
这里用到Object对象的两个方法
1、Object.defineProperty(obj, propertyName, propertyDescriptor) :添加/修改对象指定属性的特性
2、Object.getOwnPropertyDescriptor(object, propertyName) :返回对象属性的描述
特性名称 | 描述 | 默认值 |
---|---|---|
value | 设置属性的值 | undefined |
writable | 是否可修改属性的值; | true:可修改属性的值;false:不可修改属性的值 false |
enumerable | 是否可枚举属性; | true:可枚举,可通过for/in语句枚举属性;false:不可枚举 false |
configurable | 是否可修改属性的特性; | true:可修改属性的特性(如把writable从false改为true);false:不可修改属性的特性 false |
属性的访问方式
- 可用为 ’ . '点访问方式:obj.propertyName,属性名称必须为一个字符串,不能为变量。
- 可用’ [ ] '中括号方法方式 ,obj[propertyName],此方法访问属性更加的灵活,可以使用变量来访问属性
说明:访问一个不存在的属性,将返回undefined。给对象不存在的属性赋值,将会向该对象添加此属性。
var tn="true name"; //将属性名赋给变量
console.log(p1[tn]); //控制台输出Lily
console.log(p1.gender); //控制台输出undefined
p1.gender='female';
console.log(p1.gender); //控制台输出female
新增/修改属性
上例中,通过给一个不存在的属性赋值的方法实际上实现了新增属性;给一个已经存在的属性重新赋值,就实现了修改属性值。
删除属性 delete
说明:可以通过delete方法可以删除对象的自有属性
语法:delete obj.propertyName 或者 delete obj[propertyName]
delete p1.age;
delete p1['nationality'];
检测对象是否包含某个属性
-
使用in运算符判断对象是否包含某个属性(会检查自有属性和继承属性);
语法:属性 in 对象
返回值:如果存在,返回值为:true;不存在,则为:false。console.log('age' in p1); //true,找到自由属性age console.log('constructor' in p1); /true,在原型属性中找到constructor
-
判断对象是否拥有一个指定名称的属性(不会检查继承属性);
语法:对象.hasOwnProperty(属性)
返回值:如果存在,返回值为:true;不存在,则为:false。console.log(p1.hasOwnProperty('age')); //true console.log(p1.hasOwnProperty('constructor')); //false,不会检查原型
-
判断指定名称的属性是否为可枚举的自有属性
语法:对象.propertyIsEnumerable(属性)
前面的例子中,我们为p1增加了一个不可枚举的属性xconsole.log(p1.propertyIsEnumerable('age')); //true console.log(p1.propertyIsEnumerable('x')); //false
属性的遍历
这里用一个构造函数的例子,来讲解一下属性的变量
var Spanner= function (material) {
this.material= material;
}
Spanner.prototype.width=100;
var s1=new Spanner("Fe");
// 为s1添加一个不可枚举属性x
Object.defineProperty(s1,'x',{
value:'x',
enumerable:false
});
1、for / in 语句 遍历对象可枚举的实例属性和继承属性
2、Object.keys(obj) 返回一个数组,包含对象可枚举的自有属性名称
3、 Object.getOwnPropertyNames(obj) 返回一个数组,包含对象的所有自有属性(可枚举和不可枚举的)名称。
for(var key in s1){
console.log(key); //material width
}
console.log(Object.keys(s1)); // ["material"]
console.log(Object.getOwnPropertyNames(s1)); // ["material", "x"]
对象字面量与JSON
对象字面量与JSON 字符串形式上看起来很像,JSON 是一种独立的语言,JSON 字符串现在常用于进行前后端的数据交互,JavaScript提供了一个内置对象JSON,可以实现js对象与json字符串的互转。
JSON 语法规则
- 数据为 键/值 对。
- 数据由逗号分隔。
- 大括号保存对象
- 方括号保存数组
JSON.stringify返回一个字符串,js对象的可枚举属性成为json字符串的键,属性值成为键值;方法名和方法会被过滤掉。
console.log(JSON.stringify(p1)); //{"true name":"Lily","age":18,"nationality":"China"} 注意这里没有run属性和x属性
console.log(JSON.stringify(s1)); //{"material":"Fe"} 没有x属性