javascript屬性描述符詳細介紹

admin發表於2017-04-05

ECMAScript5規定了value、writable、configurable、enumerable、get、set共6個屬性描述符,用於完成不同的功能。

下面就介紹一下這六個屬性描述符的作用,先看一個屬性描述符的定義:

[JavaScript] 純文字檢視 複製程式碼
{
  value:"屬性值",
  writable:true,
  configurable:true,
  enumerable:true
}

引數介紹:

(1).vaue:規定屬性值。

(2).writable:用來規定屬性是否可寫,如果是true就是可寫,如果為false就是不可寫。

(3).configurable:定義是否可以刪除,如果是true就是可以刪除,如果為false就是不可刪除。

(4).enumerable:定義是否可以迭代,如果是true就可以迭代,如果false則是不可以迭代。

後三個描述符可定義也可不定義,他們的鍵值都預設為true。

使用增強的物件模型定義屬性:

如果要使用ECMAScript5屬性描述符定義屬性,需要使用靜態方法Object.defineProperty()。

該方法是用來定義屬性的,在定義屬性時可以改變描述符的鍵值。

語法結構如下:

[JavaScript] 純文字檢視 複製程式碼
Object.defineProperty(obj,prop,desc)

程式碼例項如下:

[JavaScript] 純文字檢視 複製程式碼
function Antzone(){}
Object.defineProperty(Antzone.prototype,"url",{
  value:"softwhy.com",
  writable:true,
  enumerable:true,
  configurable:true
});
var antzone=new Antzone();
console.log(antzone.url);

如果希望屬性是隻讀的,那麼只需要將writable屬性值設定為false即可。

我們也可以一次性定義多個屬性,可以參閱Object.defineProperties()方法一章節。

定義get和set方法:

Object.defineProperty()方法還可以定義get和set存取方法。

由於get和set存取方法需要一個私有的中間變數,最好定義一個自執行的匿名函式來包含Object.defineProperty()方法定義。

[JavaScript] 純文字檢視 複製程式碼
function Antzone(){}
(function(){
  var _url="softwhy.com";
  Object.defineProperty(Antzone.prototype,"url",{
    get:function(){return _url;},
    set:function(value){_url=value;}
  });
})();
var antzone=new Antzone();
console.log(antzone.url);
antzone.url="51texiao.cn";
console.log(antzone.url);

相關文章