Vue 2.0, data declaration variable, this can access the direct access to

What happens when Vue 2.0 new Vue()

function Vue (options) {
  if(process.env.NODE_ENV ! = ='production' &&
    !(this instanceof Vue)
  ) {
    warn('Vue is a constructor and should be called with the `new` keyword')}this._init(options)
}

Copy the code

Using the source code, you can see that the constructor new Vue executes _init,

Looking at the _init method, there are a number of initializations: lifecycle, events, props, methods, data, computed, and watch

Let’s look at initState:

If the options passed in have props and methods, initialize it, and then check whether there is data. If so, initialize initData

Check whether data is a function. If it is, call getData

_data (); / / if the key in data conflicts with the key defined by props and methods

DefineProperty sets setters and getters, so calling this.message is essentially calling this._data.message