Javascript面向对象-对象属性详解

对象的属性指对象的成员。讲解属性之前介绍一下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

属性的访问方式

1. 可用为 ’ . '点访问方式：obj.propertyName，属性名称必须为一个字符串，不能为变量。
2. 可用’ [ ] '中括号方法方式 ，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'];

检测对象是否包含某个属性

1. 使用in运算符判断对象是否包含某个属性(会检查自有属性和继承属性)；
   语法：属性 in 对象
   返回值：如果存在，返回值为：true；不存在，则为：false。

   console.log('age' in p1);  //true,找到自由属性age
   console.log('constructor' in p1);   /true,在原型属性中找到constructor
   

2. 判断对象是否拥有一个指定名称的属性（不会检查继承属性）；
   语法：对象.hasOwnProperty(属性)
   返回值：如果存在，返回值为：true；不存在，则为：false。

   console.log(p1.hasOwnProperty('age'));  //true
   console.log(p1.hasOwnProperty('constructor'));  //false，不会检查原型
   

3. 判断指定名称的属性是否为可枚举的自有属性
   语法：对象.propertyIsEnumerable(属性)
   前面的例子中，我们为p1增加了一个不可枚举的属性x

   console.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属性

JavaScript的JSON对象