【Vue温故】粗略实现VUE源码data与method

一.Method遗漏概念

1.Vue创建实例时，会自动为methods绑定当前实例this，保证在事件监听时，回调始终指向当前组件实例

2.方法要避免使用箭头函数，箭头函数会阻止Vue正确绑定组件实例this

二.粗略实现代理与Method对象

let Vue = (function(){
  function Vue(options){
      this.$data = options.data();
      this._methods = options.methods;
      this._init(this)
    }
    Vue.prototype._init = function(vm){
      initData(vm);
      initMethods(vm);
    }
    function initData(vm){
      for(var key in vm.$data){
        (
          function(key){
            Object.defineProperty(vm,key,{
              get:function(){
                return vm.$data[key]
              },
              set:function(newValue){
                vm.$data[key] = newValue
              }
            })
          }
        )(key)
      } 
    }
    function initMethods(vm){
      for(var key in vm._methods){
        vm[key] = vm._methods[key]
      }
    }
    return Vue;

})