Proxy 支持的13种拦截操作
get(target, propKey, receiver):拦截对象属性的读取,比如proxy.foo和proxy['foo']。
set(target, propKey, value, receiver):拦截对象属性的设置,比如proxy.foo = v或proxy['foo'] = v,返回一个布尔值。
has(target, propKey):拦截propKey in proxy的操作,返回一个布尔值。
deleteProperty(target, propKey):拦截delete proxy[propKey]的操作,返回一个布尔值。
ownKeys(target):拦截Object.getOwnPropertyNames(proxy)、Object.getOwnPropertySymbols(proxy)、Object.keys(proxy)、for...in循环,返回一个数组。该方法返回目标对象所有自身的属性的属性名,而Object.keys()的返回结果仅包括目标对象自身的可遍历属性。
getOwnPropertyDescriptor(target, propKey):拦截Object.getOwnPropertyDescriptor(proxy, propKey),返回属性的描述对象。
defineProperty(target, propKey, propDesc):拦截Object.defineProperty(proxy, propKey, propDesc)、Object.defineProperties(proxy, propDescs),返回一个布尔值。
preventExtensions(target):拦截Object.preventExtensions(proxy),返回一个布尔值。
getPrototypeOf(target):拦截Object.getPrototypeOf(proxy),返回一个对象。
isExtensible(target):拦截Object.isExtensible(proxy),返回一个布尔值。
setPrototypeOf(target, proto):拦截Object.setPrototypeOf(proxy, proto),返回一个布尔值。如果目标对象是函数,那么还有两种额外操作可以拦截。
apply(target, object, args):拦截 Proxy 实例作为函数调用的操作,比如proxy(...args)、proxy.call(object, ...args)、proxy.apply(...)。
construct(target, args):拦截 Proxy 实例作为构造函数调用的操作,比如new proxy(...args)。
var obj = new Proxy({}, { get: function (target, propKey, receiver) { console.log(`getting ${propKey}!`); return Reflect.get(target, propKey, receiver); }, set: function (target, propKey, value, receiver) { console.log(`setting ${propKey}!`); return Reflect.set(target, propKey, value, receiver); } });
let obj = { a: 1, b: 2 }; let proxy = new Proxy(obj, { get(target, prop, rec) {
//目标对象,要查询的属性,代理对象 console.log(target); console.log(prop); console.log(rec); return target[prop] }
,
set(target,prop,value,rec){
//目标对象,目标对象上的字符串键属性,赋给属性的值,接收最初赋值的对象
console.log(target);
console.log(prop);
console.log(value);
console.log(rec);
target[prop] = value
}
}); // console.log(proxy); console.log(proxy.a);
proxy.a = 10
console.log(proxy.a);
let hs = {name:"an"}; let proxy = new Proxy(hs,{ get(obj,property){ console.log(property); console.log(obj); return obj[property]; }, set(obj,property,value){ obj[property] = value; return true; } }); console.log(proxy.name); proxy.name = "xxxx" console.log(proxy.name);
function jiecheng(num){ return num == 1 ? 1:num*jiecheng(num-1); }; let proxy = new Proxy(jiecheng,{ apply(func,obj,args){ console.time("run"); func.apply(this,args); console.timeEnd("run"); } }); proxy.apply({},[1000]); //run: 0.2119140625 ms
let lessons = [ { title:"mysql啊啊啊发是是是", name:"mmmmmm" }, { title:"fafsafdafsafdasfaf", name:"assssss" }, { title:"方法啊 而非吉里吉里", name:"eeeeeee" } ]; let proxy = new Proxy(lessons,{ get(array,key){ let title = array[key].title; array[key].title = title.length > 5 ? title.substr(0,5) + ".".repeat(3) :title; return array[key]; } }); console.log(proxy[2]);