vue3学习——vue3响应式原理

hello 我是小零，最近在看vue，应该是刚入门。vue2以前零零碎碎看过一两遍，但是总感觉没有将知识点糅合在一起，趁着这次得空决定重游一次vue。

vue3响应式的实现原理——window对象的两个对象Proxy代理对象和Reflect反射对象。

    ```
let person={
    name:'张三',
    age:18
} 
    ```
//     模拟Vue3中的响应式
    const p=new Proxy(person,{
    //     有人读取p某个属性时调用
        get(target, propName) {
            console.log(`有人读取p身上的${propName}属性`);
            // return target[propName];
            return Reflect.get(target,propName);
        },

        // 有人修改p的某个属性时，或给p追加某个属性时调用
        set(target, propName, newValue) {
            console.log(`有人修改了p身上的属性${propName}属性，我要去更新界面`);
            // target[propName]=newValue;
            Reflect.set(target,propName,newValue);
        },

        // 有人删除p的某个属性时调用
        deleteProperty(target, p) {
            console.log(`有人删除了p身上的属性${p}属性,我要去更新界面`);
            // return delete target[p];
            return Reflect.defineProperty(target,p);
        }
    })