es7----proxy

Proxy  对象用于定义基本操作的自定义行为(如属性查找,赋值,枚举,函数调用等),等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程。

基本语法:new Proxy(obj, handler)

它的handler有13种操作:具体看 官方文档

proxy是代理的意思,es7新增这个可以代理某个变量的“增删改查”,vue3 的核心原理就是这个~~

基本使用方法:

let json = {a: 123, c: 999}
let p = new Proxy(json, {
    get(target, name, proxy){
        return target[name]
    },
    set(targe, name, value, proxy) {
        targe[name] = value
    },
    deleteProperty(targe, name) {
        delete targe[name]
    },
    has(target, name) {
        console.log(target, name)
    }
})
//触发get
console.log(p.a)
//触发set
p.b = 456
console.log(json)
//触发deleteProperty
delete p.c
console.log(json)
//触发has
"b" in p

意思就是p代理了json对象的任何操作,就是说在对通过p对j'son进行“增删改查”的时候都是可以监听到的(分别触发get、set、deleteProperty、has方法),这个就是为什么vue.data中某个数据被修改后,可以实时地监测到并且被重新渲染了

原文地址:https://www.cnblogs.com/amiezhang/p/8428951.html