講解大致會(huì)根據(jù)下圖展開
本文部分參考了書籍《你不知道的javascript》上卷
對(duì)象的定義與賦值
經(jīng)常使用的定義與賦值方法obj.prop =value
或者obj['prop']=value
Object.defineProperty()語(yǔ)法說(shuō)明
Object.defineProperty()
的作用就是直接在一個(gè)對(duì)象上定義一個(gè)新屬性吏够,或者修改一個(gè)已經(jīng)存在的屬性
Object.defineProperty(obj, prop, desc)
- obj 需要定義屬性的當(dāng)前對(duì)象
- prop 當(dāng)前需要定義的屬性名
- desc 屬性描述符
一般通過(guò)為對(duì)象的屬性賦值的情況下,對(duì)象的屬性可以修改也可以刪除,但是通過(guò)Object.defineProperty()定義屬性,通過(guò)描述符的設(shè)置可以進(jìn)行更精準(zhǔn)的控制對(duì)象屬性挟阻。
屬性的特性以及內(nèi)部屬性
javacript 有三種類型的屬性
- 命名數(shù)據(jù)屬性:擁有一個(gè)確定的值的屬性别厘。這也是最常見的屬性
- 命名訪問(wèn)器屬性:通過(guò)
getter
和setter
進(jìn)行讀取和賦值的屬性 - 內(nèi)部屬性:由JavaScript引擎內(nèi)部使用的屬性,不能通過(guò)JavaScript代碼直接訪問(wèn)到潭枣,不過(guò)可以通過(guò)一些方法間接的讀取和設(shè)置震放。比如宾毒,每個(gè)對(duì)象都有一個(gè)內(nèi)部屬性
[[Prototype]]
,你不能直接訪問(wèn)這個(gè)屬性殿遂,但可以通過(guò)Object.getPrototypeOf()
方法間接的讀取到它的值伍俘。雖然內(nèi)部屬性通常用一個(gè)雙呂括號(hào)包圍的名稱來(lái)表示邪锌,但實(shí)際上這并不是它們的名字勉躺,它們是一種抽象操作癌瘾,是不可見的,根本沒(méi)有上面兩種屬性有的那種字符串類型的屬性
屬性描述符
通過(guò)Object.defineProperty()為對(duì)象定義屬性饵溅,有兩種形式妨退,且不能混合使用,分別為數(shù)據(jù)描述符蜕企,存取描述符咬荷,下面分別描述下兩者的區(qū)別:
數(shù)據(jù)描述符 --特有的兩個(gè)屬性(value,writable)
let Person = {}
Object.defineProperty(Person, 'name', {
value: 'jack',
writable: true // 是否可以改變
})
注意,如果描述符中的某些屬性被省略轻掩,會(huì)使用以下默認(rèn)規(guī)則:
存取描述符 --是由一對(duì) getter幸乒、setter 函數(shù)功能來(lái)描述的屬性
get
:一個(gè)給屬性提供getter
的方法,如果沒(méi)有getter
則為undefined
唇牧。該方法返回值被用作屬性值罕扎。默認(rèn)為undefined
。
set
:一個(gè)給屬性提供setter
的方法丐重,如果沒(méi)有setter
則為undefined
腔召。該方法將接受唯一參數(shù),并將該參數(shù)的新值分配給該屬性扮惦。默認(rèn)值為undefined
臀蛛。
let Person = {}
let temp = null
Object.defineProperty(Person, 'name', {
get: function () {
return temp
},
set: function (val) {
temp = val
}
})
數(shù)據(jù)描述符和存取描述均具有以下描述符
- configrable 描述屬性是否配置,以及可否刪除
- enumerable 描述屬性是否會(huì)出現(xiàn)在for in 或者 Object.keys()的遍歷中
configrable 代碼片段分析
從以上代碼運(yùn)行結(jié)果分析總結(jié)可知:
- configurable: false 時(shí)崖蜜,不能刪除當(dāng)前屬性浊仆,且不能重新配置當(dāng)前屬性的描述符(有一個(gè)小小的意外:可以把writable的狀態(tài)由true改為false,但是無(wú)法由false改為true),但是在writable: true的情況下,可以改變value的值
- configurable: true時(shí)豫领,可以刪除當(dāng)前屬性抡柿,可以配置當(dāng)前屬性所有描述符。
enumerable 代碼片段分析
注意:以下二種區(qū)別
不變性
- 對(duì)象常量
結(jié)合writable: false 和 configurable: false 就可以創(chuàng)建一個(gè)真正的常量屬性(不可修改氏堤,不可重新定義或者刪除)
- 禁止擴(kuò)展
如果你想禁止一個(gè)對(duì)象添加新屬性并且保留已有屬性沙绝,就可以使用Object.preventExtensions(...)
在非嚴(yán)格模式下,創(chuàng)建屬性gender會(huì)靜默失敗鼠锈,在嚴(yán)格模式下闪檬,將會(huì)拋出異常。
- 密封
Object.seal()會(huì)創(chuàng)建一個(gè)密封的對(duì)象,這個(gè)方法實(shí)際上會(huì)在一個(gè)現(xiàn)有對(duì)象上調(diào)用object.preventExtensions(...)并把所有現(xiàn)有屬性標(biāo)記為configurable:false甘有。
所以蒂萎, 密封之后不僅不能添加新屬性,也不能重新配置或者刪除任何現(xiàn)有屬性(雖然可以改屬性的值)
-
凍結(jié)
Object.freeze()會(huì)創(chuàng)建一個(gè)凍結(jié)對(duì)象样傍,這個(gè)方法實(shí)際上會(huì)在一個(gè)現(xiàn)有對(duì)象上調(diào)用Object.seal(),并把所有現(xiàn)有屬性標(biāo)記為writable: false,這樣就無(wú)法修改它們的值横缔。
這個(gè)方法是你可以應(yīng)用在對(duì)象上級(jí)別最高的不可變性,它會(huì)禁止對(duì)于對(duì)象本身及其任意直接屬性的修改(但是這個(gè)對(duì)象引用的其他對(duì)象是不受影響的)
你可以深度凍結(jié)一個(gè)對(duì)象衫哥,具體方法為茎刚,首先這個(gè)對(duì)象上調(diào)用Object.freeze()然后遍歷它引用的所有對(duì)象,并在這些對(duì)象上調(diào)用Object.freeze()撤逢。但是一定要小心膛锭,因?yàn)檫@么做有可能會(huì)無(wú)意中凍結(jié)其他共享對(duì)象。
屬性定義和屬性賦值
最后一小節(jié)蚊荣,總結(jié)一下上述內(nèi)容
屬性定義,通過(guò)Object.defineProperty()形式
- 如果Obj沒(méi)有名為Prop的自身屬性的話:如果Obj是可擴(kuò)展的話初狰,則創(chuàng)建Prop這個(gè)自身屬性,否則拒絕
- 如果Obj已經(jīng)有了名為Prop的自身屬性:則按照下面的步驟重新配置這個(gè)屬性
- 如果這個(gè)已有的屬性是不可配置的互例,則進(jìn)行下面的操作會(huì)被拒絕
1: 將一個(gè)數(shù)據(jù)屬性轉(zhuǎn)換成訪問(wèn)器屬性奢入,反之變?nèi)?2: 改變`[[Configurable]]`或`[[Enumerable]]`
3: 改變[[Writable]]由false變?yōu)閠rue
4: 在`[[Writable]]`為`false`時(shí)改變`[[Value]]`
5: 改變[[Get]]或[[Set]]
- 否則這個(gè)已有的屬性可以被重新配置
屬性賦值,通過(guò)obj.prop = ''prop"形式
- 如果在原型鏈上存在一個(gè)名為
P
的只讀屬性(只讀的數(shù)據(jù)屬性或者沒(méi)有setter
的訪問(wèn)器屬性),則拒絕 - 如果在原型鏈上存在一個(gè)名為
P
的且擁有setter
的訪問(wèn)器屬性媳叨,則調(diào)用這個(gè)setter
- 如果沒(méi)有名為
P
的自身屬性腥光,則如果這個(gè)對(duì)象是可擴(kuò)展的,就創(chuàng)建一個(gè)新屬性肩杈,否則柴我,如果這個(gè)對(duì)象是不可擴(kuò)展的,則拒絕 - 如果已經(jīng)存在一個(gè)可寫的名為P的自身屬性扩然,則調(diào)用Object.defineProperty(),該操作只會(huì)更改
P
屬性的值艘儒,其他的特性(比如可枚舉性)都不會(huì)改變
作用以及影響
屬性的定義操作和賦值操作各自有自己的作用和影響。
賦值可能會(huì)調(diào)用原型上的setter
夫偶,定義會(huì)創(chuàng)建一個(gè)自身屬性界睁。
原型鏈中的同名只讀屬性可能會(huì)阻止賦值操作,但不會(huì)阻止定義操作兵拢。如果原型鏈中存在一個(gè)同名的只讀屬性翻斟,則無(wú)法通過(guò)賦值的方式在原對(duì)象上添加這個(gè)自身屬性,必須使用定義操作才可以说铃。這項(xiàng)限制是在ECMAScript 5.1中引入的
賦值運(yùn)算符不會(huì)改變?cè)玩溕系膶傩?br> 不能通過(guò)為
obj.foo
賦值來(lái)改變proto.foo
的值访惜。這種操作只會(huì)在obj
上新建一個(gè)自身屬性對(duì)象字面量中的屬性是通過(guò)定義操作添加的。
再次啰嗦一次腻扇,記住以下兩種形式的區(qū)別:
上面的代碼等同于:
另一方面:
上面的代碼等同于: