Object.defineProterty
數(shù)據(jù)屬性:value, writable, configurable, enumerable
訪問(wèn)器屬性:get,set
注:不能同時(shí)設(shè)置value和writable,這兩對(duì)屬性是互斥的
let objOne={}, defaultNameOne="這是默認(rèn)值2";
Object.defineProperty(obj, 'name',? {
????get() {
????????return????defaultNameOne;?
?????},
????set(value) { defaultNameOne =value; }?
?});?
?console.log(objOne.name);?
?objOne.name = "這是改變值2";?
?console.log(objOne.name);
proxy
let handler = {
? ? get(target, key, receiver) {
? ? ? console.log("get", key);
? ? ? return Reflect.get(target, key, receiver);
? ? },
? ? set(target, key, value, receiver) {
? ? ? console.log("set", key, value);
? ? ? return Reflect.set(target, key, value, receiver);
? ? }
? };
? let proxy = new Proxy(obj, handler);
? proxy.name = "李四";
? proxy.age = 24;
defineProterty和proxy的對(duì)比：
1.defineProterty是es5的標(biāo)準(zhǔn),proxy是es6的標(biāo)準(zhǔn);
2.proxy可以監(jiān)聽(tīng)到數(shù)組索引賦值,改變數(shù)組長(zhǎng)度的變化;
3.proxy是監(jiān)聽(tīng)對(duì)象,不用深層遍歷,defineProterty是監(jiān)聽(tīng)屬性;
3.利用defineProterty實(shí)現(xiàn)雙向數(shù)據(jù)綁定(vue2.x采用的核心)
4.利用proxy實(shí)現(xiàn)雙向數(shù)據(jù)綁定(vue3.x會(huì)采用)
