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時，便是只能寫入而不能讀取

以上是Javascript物件中的資料屬性與存取器屬性實例詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！