自己写一个简陋版Vue

    // 构造app函数
    function App(config,$){
        this["$"]= $;
        for( var i in config ) {
             console.log(i);
            this[i]= config[i];
        }
        this["AppInit"]=function(){
               // 这里this指向app
                let  properties = this.data;
                for( var i in properties ) {
                    // +--------------------------------------------------------
                    // ｜错误的写法,原因匿名函数内部this执行windows
                    // +--------------------------------------------------------
                    // ｜(function(){
                    // ｜    this[ "get" + i ] = function() {
                    // ｜        return this.data.i;
                    // ｜    };
                    // ｜    this[ "set" + i ] = function(val) {
                    // ｜        this.change(i,val);
                    // ｜        this.data.i = val;
                    // ｜    };
                    // ｜})();
                    // |console.log(this);
                    // +--------------------------------------------------------
                    
                    // +--------------------------------------------------------
                    // ｜注册getter()和setter()方法
                    // +--------------------------------------------------------
                    this.registerGetter(i);
                    this.registerSetter(i);
                };
                //挂载mounted到this上
                if(this.mounted != undefined){
                    for( var fun in this.mounted ){
                        this[fun]= this.mounted[fun];
                    }
                    
                }
          };
        this["registerGetter"]=function (propertiesName){
           this[ "get" +propertiesName ] = function() {
                return this.data[propertiesName];
            };
        };
        this["registerSetter"]=function (propertiesName){
            this[ "set" + propertiesName ] = function(val) {
                this.change(propertiesName,val);
                this.data[propertiesName] = val;
            };
        };
        this['change']=function(name,newVale){
            // 如果监听这个属性则把两次值传给函数
            if(this.watch[name] != undefined){
                this.runWatch = this.watch[name].handler;
                this.runWatch(newVale,this["get"+name]());
             }
            // 更新计算属性
            // 。。。。
            // 更新页面内容
            // 。。。。
        };
         this['runWatch'] =function (){},
        this.AppInit();
        // 下面可以自定义生命周期函数
        if(this['onLoad'] !=undefined ){
            this['onLoad']();
        }
        if(this['run'] != undefined){
            this['run']();
        }
    };

用法

 const app = new App({
        data:{
            "Name":"asd",
            "Age":19,
        },
        watch:{
          Group:{
                deep:true,
                handler:function(newVale,oldValue){
                    
                }
            }
        },
        onLoad:function(){
            this.setAge(10);
        },
        mounted:{
            
        },
        run:function (){
            
        }, $
    });
    window.app = app;