1.proxy
- proxy主要用于创建代理,用于各种数据拦截。数据拦截我们最熟悉的自然是defineProperty,vue2中使用该函数进行数据劫持,从而实现数据的监听和分发。但是有一个问题就是使用defineProperty只能监听数据的读写,对于对象属性的增删无法进行劫持。而proxy中可以拦截的类型多达13种,这也是为什么vue3改用proxy的原因。proxy最大的缺点就是浏览器支持不足。
代理其实是对对象加一层拦截器,实际上所有的拦截活动都通过代理接收者触发,而被代理对象的属性并不会被触发。
let obj = new Proxy({},{
get(target,property,receiver){
// target 代表被代理对象,本例中尾空对象
// property 代表访问的属性
// receiver 代表代理接收者,本里中为obj
},
set(target, property, value, receiver){
// target 代表被代理对对象,本例中尾空对象
// property 代表访问的属性
// value 设置的值
// receiver 代表代理接收者,本里中为obj
},
construct(target, args, newTarge){
// target 代理对象
// args 参数
// newTarget 构造函数
// new命令被拦截
},
has(target, key){
// target 代理对象
// key 属性
// in运算符被拦截(for in 不拦截)
},
apply(target, ctx, args){
// target 目标对象
// ctx 目标对象的上下文对象
// arg 参数
// 函数调用,call,apply时调用
}
})