Vue的内部运行机制

		let uid=0
		class Dep {
		    constructor(){
		        this.id = uid++
		        this.subs=[]
		    }
		    addSubs(){
		        this.subs.push(Dep.target)
		    }
		    depend(){
		        if(Dep.target){
		            this.addSubs()
		        }
		    }
		    /*通知所有订阅者*/
		    notify () {    
		        const subs = this.subs.slice()
		        for (let i = 0, l = subs.length; i < l; i++) {
		            subs[i].update()
		        }
		    }
		}
		
		 /*
		    一个解析表达式，进行依赖收集的观察者，同时在表达式数据变更时触发回调函数。它被用于$watch api以及指令
		 */
		class Watcher{
		    constructor(expns){
		        Dep.target=this
		        this.getter = expns
		        this.value = this.get() 
		    }
		    run () {
		        this.get()
		    }
		    update(){
		        this.run()
		    }
		    get(){
		        return this.getter.call(vm)
		    }
		
		}
		
		// 存取描述符（数据描述符）
		function defineReactive(obj,key,val){
		    let dep = new Dep()
		    Object.defineProperty(obj,key,{
		        enumerable:true,//可以修改
		        configurable:true,//可以出现在对象枚举属性
		        get:()=>{
		            //依赖收集
		            if (Dep.target) {
		                /*进行依赖收集*/
		                dep.depend()
		            }
		            return val
		        },
		        set:newVal=>{
		            val=newVal
		            dep.notify()
		        }
		    })
		}
		
		function observe (value){
		    Object.keys(value).forEach(key => {
		        defineReactive(value,key,value[key])
		    });
		}
		
		
		/*代理*/
		function _proxy (data) {
		    const that = this;
		    Object.keys(data).forEach(key => {
		        Object.defineProperty(that, key, {
		            configurable: true,
		            enumerable: true,
		            get: function proxyGetter () {
		                return that._data[key];
		            },
		            set: function proxySetter (val) {
		                that._data[key] = val;
		            }
		        })
		    });
		}
		
		let vm 
		class Vue{
		    constructor(options){
		        vm = this
		        //在源码中是通过代理的方式会将_data代理成vm.data
		        this._data=options.data
		        _proxy.call(this, options.data);/*构造函数中*/
		
		        observe(this._data)     
		        // 挂载
		        this._mount()   
		    }
		    _update(){
		        for (const key in this._data) {
		            if (this._data.hasOwnProperty(key)) {
		                console.log('_update渲染更新视图~',this._data[key]);                
		            }
		        }        
		    }
		    _mount(){
		        let updateComponent
		        updateComponent = () => {
		            vm._update()
		        }   
		       //注册一个观察者     
		        vm._Watcher=new Watcher(updateComponent)
		    }
		}
		
		let app = new Vue({
		    el:'#app',
		    data:{
		        text:'text1',
		        text1:'text2'
		    }
		})
		//修改
		app.text1='0'