浅谈Javascript数据属性与访问器属性

ES5中对象的属性可以分为‘数据属性’和‘访问器属性’两种。

　　数据属性一般用于存储数据数值，访问器属性对应的是set/get操作，不能直接存储数据值。

 

　　数据属性特性：value、writable、enumerable、configurable。

　　　　解释：configurable：true/false，是否可以通过delete删除属性，能否修改属性的特性，能否把属性修改为访问器属性，默认false；

　　　　　　　enumerable：true/false，是否可以通过for in循环返回，默认false；

　　　　　　　writable：true/false，是否可以修改属性的值，默认false；

　　　　　　　value：undefined，设置属性的值，默认undefined。

 

　　　访问器属性特性：set、get、enumerable、configurable。

　　　　　解释：configurable：true/false，是否可以通过delete删除属性，能否修改属性的特性，能否把属性修改为访问器属性，默认false；

　　　　　　　　enumerable：true/false，是否可以通过for in循环返回，默认false；

　　　　　　　　set：function，读取属性值时调用的函数；

　　　　　　　　get：function，修改属性值时调用的函数。

 

　　将属性添加到对象或修改现有属性的特性使用Object.defineProperty() 或 Object.defineproperties()方法;

　　　　Object.defineProperty(object, propertyname, descriptor):

　　　　参数解释：object：需要添加或修改属性的对象；

　　　　　　　　　propertyname：属性的名称，字符串格式；

　　　　　　　　　descriptor：属性的描述，设置数据属性或访问器属性的特性。

 

　　实例分析：

　　数据属性：

　　　　var emp = {

　　　　　　name:'tom'

　　　　};

 

　　　　Object.defineProperty(emp,'name',{

　　　　　　writable:false

　　　　});

　　　　emp.name = 'jery';
　　　　console.log(emp.name);//输出tom，因为已经设置了writable为false

　　　　　　

　　　　Object.defineProperty(emp,'age',{

　　　　　　configurable:false,

　　　　　　writable:true,

　　　　　　value:22

　　　　});

　　　　console.log(emp.age);//输出22，因为设置了value为22

　　　　emp.age = 25;

　　　　console.log(emp.age);//输出25，设置了writable为true

　　　　delete emp.age;

　　　　console.log(emp.age);//输出25，设置了configurable为false，此属性删除不了

 

　　访问器属性：

　　　　var emp ={

　　　　　　_name:'tom',

　　　　　　_age:20

　　　　};

　　　　

　　　　Object.defineProperty(emp,'name',{

　　　　　　get:function(){

　　　　　　　　　　return this._name;

　　　　　　　　}

　　　　});

　　　　console.log(emp.name);//输出tom，由get方法返回_name的值

　　　　emp.name = 'jery';

　　　　console.log(emp.name);//输出tom，没有set方法，修改不了_name的值　

 

　　　　Object.defineProperty(emp,'age',{

　　　　　　configurable:true,

　　　　　　get:function(){

 　　　　　　　return this._age;

　　　　　　}

　　　　　　set:function(age){

　　　　　　　　this._age = age;

　　　　　　}

　　　　});

　　　　emp.age = 25;　　
　　　　console.log(emp.age)//输出25，emp.age=25是使用set方法将25赋值给_age，emp.age是使用get方法将_age的读取出来

　　　　delete emp.age;

　　　　console.log(emp.age);//输出undefined，configurable为true，可以使用delete方法将emp.age属性删除

 

　　备注：访问器属性可以起到很好的保护作用，当只有get方法时，就实现只读不能写；反之，只有set时，便是只能写入而不能读取