vue.js 2.0版的雙向數據綁定就是通過Object.defineProperty方法實現的,俗稱屬性攔截器。
這么說吧,vue.js是通過它實現雙向綁定的。俗稱屬性攔截器。而且專門用來監控對象屬性變化的Object.observe方法也被草案發起人撤回了(此方法在node環境中仍能使用)??梢奷efineProperty的威力之大。
Object.defineProperty() 不支持ie8
方法會直接在一個對象上定義一個新屬性,或者修改一個已經存在的屬性, 并返回這個對象。
// 語法: /* * Object.defineProperty(obj,prop,descriptor) * @param: obj:需要定義屬性的對象; * prop:需要定義或修改的屬性; * descriptor:將被定義或修改屬性的描述符{} * 返回值 : 返回傳入函數的對象,即第一個參數obj */對象里目前存在的屬性描述符主要有兩種形式: 數據描述符和存取描述符.
數據描述符: 擁有可寫或不可寫值的屬性*
可選鍵值:
configurable: 當且僅當configurable為true時,改屬性描述符才能夠被改變,也能被刪除
enumerable: 當其值為true時,該屬性才能夠出現在對象的枚舉屬性中,默認為false
writable: 當且僅當該屬性的值為true時,該屬性才能被賦值運算符改變, 默認為false。
value: 該屬性對應的值,可以是任意有效的javascript的值(數值,對象,函數等),默認為undefined
存取描述符: 由一對getter-setter函數功能來描述的屬性*
可選鍵值:
configurable: 當且僅當configurable為true時,改屬性描述符才能夠被改變,也能被刪除
enumerable: 當其值為true時,該屬性才能夠出現在對象的枚舉屬性中,默認為false
get: 給屬性提供getter的方法,如果沒有 getter 則為undefined。當我們讀取某個屬性的時候,其實是在對象內部調用了該 方法,此方法必須要有return語句。該方法返回值被用作屬性值。默認為 undefined
set:設置屬性值的方法, 如果沒有 setter 則為 undefined。該方法將接受唯一參數,并將該參數的新值分配給該屬性。默認為 undefined。也就是說,當我們設置某個屬性的時候,實際上是在對象的內部調用了該方法
note:兩者不能同時定義, 否則報錯==
get和set是我們今天要重點討論的兩個方法,先看一下他們的簡單實例:
實例:
|
新聞熱點
疑難解答
圖片精選