为什么vue中data中的数据可以通过this.x 直接访问到？

先来一段vue代码

import Vue from 'vue'

new Vue({
  el: '#app',
  data: {
    message: 'hello world'
  },
  mounted() {
    console.log(this.message)
  }
})

从源码理解

function Vue (options) {
 ···
  this._init(options)       2、new Vue实例时，执行_init方法
}
···
initMixin(Vue)              1、Vue方法方法创建时，执行initMixin 给原型上绑定了_init方法
···
————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————
Vue.prototype._init = function (options?: Object) {
  const vm: Component = this
  ···
  initState(vm)              3、执行_init方法，执行initState
}
_________________________________________________________________________________________________________________________________

　export function initState (vm: Component) {

　　vm._watchers = []

　　const opts = vm.$options

　　if (opts.props) initProps(vm, opts.props)

　　if (opts.methods) initMethods(vm, opts.methods)

　　if (opts.data) {

　　　　initData(vm)　　　　　　　　4、如果实例化Vue时，data存在，执行initData方法

　　} else {

　　　　observe(vm._data = {}, true /* asRootData */)

　　}

　　if (opts.computed) initComputed(vm, opts.computed)

　　if (opts.watch && opts.watch !== nativeWatch) {

　　　　initWatch(vm, opts.watch)

　　}

 }

  ——————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

function initData (vm: Component) {
  let data = vm.$options.data
  data = vm._data = typeof data === 'function'
    ? getData(data, vm)
    : data || {}
  ···省略代码 ： 如果data不是一个对象，则提示data方法必须返回一个对象···
  // proxy data on instance
  const keys = Object.keys(data)
  const props = vm.$options.props
  const methods = vm.$options.methods
  let i = keys.length
  while (i--) {
    const key = keys[i]
    ······methods中不能存在和data中相同属性的一些判断提示······
    if (props && hasOwn(props, key)) {
      ········props中不能存在和data中相同属性的一些判断提示·······
    } else if (!isReserved(key)) {
      proxy(vm, `_data`, key)               5、代理，给vm.key 做一层代理，返回实际vm['_data'][key]
    }
  }
  // observe data
  observe(data, true /* asRootData */)
}
———————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————————

export function proxy (target: Object, sourceKey: string, key: string) {
  sharedPropertyDefinition.get = function proxyGetter () {
    return this[sourceKey][key]
  }
  sharedPropertyDefinition.set = function proxySetter (val) {
    this[sourceKey][key] = val
  }
  Object.defineProperty(target, key, sharedPropertyDefinition)      // 6、访问vm.key 时 返回了 vm['_data'][key]
}

所以在vue中通过this. 方式访问data中的数据时，实际上是返回了this._data中的数据