微信小程序數(shù)據(jù)劫持代理的實(shí)現(xiàn)
index.html

index.js
// Vue數(shù)據(jù)劫持代理
//模擬Vue中data選項(xiàng)
let data = {
username:'小鐳',
age:3
}
// 模擬組件的實(shí)例
let _this={}
// 利用object.defineProperty()
for(let item in data){
console.log(item,data[item]);
Object.defineProperty(_this,item,{
// get作用:用來(lái)獲取擴(kuò)展屬性值,當(dāng)獲取該屬性時(shí)調(diào)用get方法
get(){
console.log('get()');
return data[item]
}
})
}
console.log(_this)
當(dāng)要獲取訪(fǎng)問(wèn)age或username的值時(shí),才會(huì)調(diào)用get()方法,打印get()

若要修改data中的username的 值,可以直接通過(guò)_this.username修改嗎?
答案是:不可以

(沒(méi)有修改成功,username還是“小鐳")

可以通過(guò)set方法修改值


for(let item in data){
console.log(item,data[item]);
Object.defineProperty(_this,item,{
// get作用:用來(lái)獲取擴(kuò)展屬性值,當(dāng)獲取該屬性時(shí)調(diào)用get方法
get(){
console.log('get()');
return data[item]
},
//set作用:監(jiān)視擴(kuò)展屬性的,只要已修改就調(diào)用
set(newValue){
console.log('set()',newValue);
// _this.username=newValue; 千萬(wàn)不要在set方法中修改當(dāng)前擴(kuò)展屬性的值,會(huì)出現(xiàn)死循環(huán)
data[item] = newValue;
}
})
}(修改成功?。?nbsp;

到此這篇關(guān)于微信小程序數(shù)據(jù)劫持代理的實(shí)現(xiàn)的文章就介紹到這了,更多相關(guān)小程序數(shù)據(jù)劫持代理內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JS代碼實(shí)現(xiàn)根據(jù)時(shí)間變換頁(yè)面背景效果
這篇文章主要介紹了JS代碼實(shí)現(xiàn)根據(jù)時(shí)間變換頁(yè)面背景效果的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友一起看下吧2016-06-06
JS中Eval解析JSON字符串的一個(gè)小問(wèn)題
JSON (JavaScript Object Notation)一種簡(jiǎn)單的數(shù)據(jù)格式,比xml更輕巧,下面通過(guò)本文給大家介紹JS中Eval解析JSON字符串的一個(gè)小問(wèn)題,需要的朋友參考下吧2016-02-02
JavaScript中各種編碼解碼函數(shù)的區(qū)別和注意事項(xiàng)
JavaScript 中encodeURI,encodeURIComponent與escape的區(qū)別和注2010-08-08
js攔截alert對(duì)話(huà)框另類(lèi)應(yīng)用
alert對(duì)話(huà)框的使用給用戶(hù)帶來(lái)了很多的方便,而有些時(shí)候不希望讓它存在,接下來(lái)介紹如何使用js攔截alert對(duì)話(huà)框,感興趣的朋友可以了解下2013-01-01

