摘要:有以下中方式可以使用和對象初始化器關(guān)鍵字使用關(guān)鍵字為屬性添加一個函數(shù),函數(shù)名即為屬性名,函數(shù)不傳參,函數(shù)傳入的參數(shù)為設(shè)置對象的新值。需被定義或修改的屬性名。目前流行的框架的響應(yīng)式系統(tǒng)就是利用設(shè)置來追蹤數(shù)據(jù)變化,從而導(dǎo)致視圖更新。
什么是getter 和 setter ?
getter: 讀取對象屬性時將被調(diào)用的函數(shù)。
setter:設(shè)置對象屬性時被調(diào)用的函數(shù)。
有以下4中方式可以使用 setter 和 getter:
1. 對象初始化器set/get 關(guān)鍵字使用get/set關(guān)鍵字為屬性添加一個函數(shù),函數(shù)名即為屬性名,get函數(shù)不傳參,set函數(shù)傳入的參數(shù)為設(shè)置對象的新值。
例如:
var person = { _name: "", get name() { return this._name }, set name(newName) { this._name = newName } } // 測試 person.name // "" person.name = "john" // "john", 此時 person._name 也變成了 "john"2. Object.defineProperty()
Object.defineProperty() 方法直接在一個對象上定義一個新屬性,或者修改一個已經(jīng)存在的屬性, 并返回這個對象。
語法:
Object.defineProperty(obj, prop, descriptor)
參數(shù):
obj:
需要定義屬性的對象。
prop:
需被定義或修改的屬性名。
descriptor:
需被定義或修改的屬性的描述符。
var person = {} var name = "" Object.defineProperty(person, "name", { configurable: true, enumerable: true, get: function() { return name }, set: function(newName) { name = newName } }) // 測試 person.name // undefind person.name = "john" // "john",此時全局的 name 也變成了 "john"3. Object.defineProperties()
在一個對象上添加或修改一個或多個自由屬性。
用法類似Object.defineProperty()
語法
Object.defineProperties(obj, props)
參數(shù)
obj: 將要被添加屬性或修改屬性的對象 props: 該對象的一個或多個鍵值對定義了將要為對象添加或修改的屬性的具體配置
var obj = {a:1,b:"string"}; Object.defineProperties(obj,{ "A":{ get:function(){return this.a+1;}, set:function(val){this.a = val;} }, "B":{ get:function(){return this.b+2;}, set:function(val){this.b = val} } }); //測試 obj.A; //2 obj.B; // "string2" obj.A = 3; obj.B = "hello"; obj.A; // 4 obj.B; // "hello2"4. Object.create()
Object.create() 方法創(chuàng)建一個擁有指定原型和若干個指定屬性的對象。即提供新創(chuàng)建的對象的__proto__。
語法
Object.create(proto, [ propertiesObject ])
參數(shù)
proto:新創(chuàng)建對象的原型對象
propertiesObject:可選。新創(chuàng)建對象的可枚舉屬性對象的屬性描述符以及相應(yīng)的屬性名稱,這些屬性對應(yīng)Object.defineProperties()的第二個參數(shù)。
var o = null; o = Object.create(Object.prototype,//指定原型為 Object.prototype { bar:{ get :function(){ return 10; }, set : function (val) { console.log("Setting `o.bar` to ",val); } } }//第二個參數(shù) ); //測試 o.bar; //10 o.bar = 12; // 控制臺打印出:"Setting `o.bar` to 12"
如果你希望對象屬性值只能讀取不能被修改,那么可以不設(shè)置set函數(shù)。
目前流行的框架Vue的響應(yīng)式系統(tǒng)就是利用Object.defineProperty() 設(shè)置getter/setter來追蹤數(shù)據(jù)變化,從而導(dǎo)致視圖更新。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/96291.html
摘要:回顧上回提到,計算屬性的緩存與這個類的屬性有關(guān),那么這次我們接著來看下,屬性到底取決于什么情況來變化,從而對進(jìn)行緩存。 回顧 上回提到,computed————計算屬性的緩存與Watcher這個類的dirty屬性有關(guān),那么這次我們接著來看下,dirty屬性到底取決于什么情況來變化,從而對computed進(jìn)行緩存。 依賴收集 切入正題之前,我們先來看一個問題:如果一個computed的結(jié)...
摘要:如同其它虛擬機(jī),虛擬機(jī)為字節(jié)碼提供了一個運行時環(huán)境。編譯是一個混合模式的虛擬機(jī),也就是說它既可以解釋字節(jié)碼,又可以將代碼編譯為本地機(jī)器碼以更快的執(zhí)行。解決此問題一般是在進(jìn)程啟動后,對代碼進(jìn)行預(yù)熱以使它們被強制編譯。 Java HotSpot虛擬機(jī)是Oracle收購Sun時獲得的,JVM和開源的OpenJDK都是以此虛擬機(jī)為基礎(chǔ)發(fā)展的。如同其它虛擬機(jī),HotSpot虛擬機(jī)為字節(jié)碼提供了一...
閱讀 2444·2021-09-22 15:41
閱讀 1456·2021-08-19 10:54
閱讀 1767·2019-08-23 15:11
閱讀 3407·2019-08-23 10:23
閱讀 1434·2019-08-22 16:28
閱讀 804·2019-08-22 15:11
閱讀 746·2019-08-22 14:53
閱讀 720·2019-08-22 13:49