ES5 資料屬性描述符和訪問描述符

2021-09-08 01:15:43 字數 3984 閱讀 6962

物件是乙個屬性集合,物件的基本特徵是屬性名(name)和屬性值(value)。es5 增加了屬性描述符,可以更細膩的控制屬性的不同操作。屬性描述符有 configurable、writable 和 enumerable。

屬性描述符通常和 object.defineproperty/object.defineproperties 一起使用來定義屬性,它也會受到諸如 object.freeze/object.seal 等方法改變。

1. configurable 當且僅當 configurable 為 true 時,該屬性才能夠被改變,也能夠被刪除(delete),預設為 false

var obj = {}

object.defineproperty(obj, 'name', )

// 不能 delete

delete obj.name // false

object.defineproperty(obj, 'name', )

// 可以delete

delete obj.name // true

2. writable 當且僅當 writable 為 true 時,該屬性才能被賦值運算子(=)改變,預設為 false

var obj = {}

object.defineproperty(obj, 'name', )

obj.name = 'backus' // 修改不起作用,仍然是 john,嚴格模式中會報錯阻止修改

object.defineproperty(obj, 'name', )

obj.name = 'backus' // 被改為了 backus

3. enumerable 當且僅當 enumerable 為 true 時,該屬性才能夠出現在物件的列舉屬性(for in)中,預設為 false

var obj = {}

object.defineproperty(obj, 'name', )

// 不能遍歷

for (var a in obj)

object.defineproperty(obj, 'name', )

// 可以遍歷

for (var a in obj)

es6 的 object.keys 只返回 enumerable=true 的屬性

var obj = 

object.defineproperty(obj, 'name', )

object.defineproperty(obj, 'age', )

object.keys(obj) // ['name']

可以通過 propertyisenumerable 方法判斷屬性的 enumerable 值

obj.propertyisenumerable('name') // true

obj.propertyisenumerable('age') // false

4. 使用 es3(傳統的) json 方式定義物件,其 configurable/writable/enumerable 預設都是 true,如下

var obj = 

// configurable

delete obj.name // true

// writable

obj.age = 32 // true

// enumerable

for (var a in obj)

也即

var obj =
等同於

object.defineproperty(obj, 'name', )

object.defineproperty(obj, 'age', )

5. 使用 es5 的 object.defineproperty/object.defineproperties 方式定義物件,其 configurable/writable/enumerable 預設都是 false,如下

var obj = {}

object.defineproperty(obj, 'name', )

object.defineproperty(obj, 'age', )

// configurable

delete obj.name // false

// writable

obj.age = 32 // false

// enumerable

for (var a in obj)

也即

object.defineproperty(obj, 'name', )
等同於

object.defineproperty(obj, 'name', )
資料屬性描述符彙總如下

訪問描述符是由一對 getter-setter 函式功能來描述的屬性,格式為

name: ,

set: function(newval) ,

enumerable: true,

configurable: true

}

例如

var obj = {}

object.defineproperty(obj, 'name', ,

set: function(newval)

})// 賦值會呼叫 set 方法

obj.name = 'john'

// 取值會呼叫 get 方法

obj.name

與上述的屬性描述符只能存在一種,即二選一,不能同時存在,否則會報錯

var obj = {}

// 錯誤方式一

object.defineproperty(obj, 'name',

})// 錯誤方式二

object.defineproperty(obj, 'name',

})

firefox 報錯如下

訪問描述符彙總如下

object.defineproperty 上面已經介紹過,object.defineproperties 批量定製物件屬性,內部其實迴圈方式呼叫 object.defineproperty

object.defineproperties(obj, ,

age:

})

object.getownpropertydescriptor 返回該物件某屬性的描述器,描述器自身是乙個物件

var obj = {}

object.defineproperty(obj, 'name', )

var des = object.getownpropertydescriptor(obj, 'name')

console.log(des)

輸出如圖

屬性描述符

在es5開始,所有屬性都具備了屬性描述符。我們可以通過object.getownpropertydescriptor來觀察到屬性的描述符,它是長這樣子的。object.getownpropertydescriptor a writable決定該屬性是否唯讀。enumerable決定該屬性是否可列舉。...

屬性描述符

property descriptor 屬性描述符 是乙個普通物件,用於描述乙個屬性的相關資訊 通過object.getownpropertydescriptor 物件,屬性名 可以得到乙個物件的某個屬性的屬性描述符 object.getownpropertydescriptors 物件 可以得到某...

物件屬性描述符

從 es5 開始,物件的屬性都具備了屬性的描述符,它能設定屬性的特性。我們可以使用 object.defineproperty 來新增或者配置乙個屬性並對它的特性進行配置。屬性有 writable enumerable 和 configurable 這三個或之一都為屬性描述符。一.writable ...