Vue实例中 data：{}是什么？是对象吗？

Question

各位，在这里的Vue实例中，为什么我用data:{}到底是个什么，可不可以详细的讲一下，还有，创建了一个Vue对象是app，那为什么我用app.data.Data1是错误的呢？那data：{}这个对象的具体用法是什么呢？

Answer 1

1.data:{} 是一个 函数（在cli里 他必须是一个函数，因为如果是对象 那么他就 会涉及 引用类形的错误）
vue中data必须是函数是为了保证组件的独立性和可复用性，data是一个函数，组件实例化的时候这个函数将会被调用，返回一个对象，计算机会给这个对象分配一个内存地址，你实例化几次，就分配几个内存地址，他们的地址都不一样，所以每个组件中的数据不会相互干扰，改变其中一个组件的状态，其它组件不变。
data就是你这个 vue里 双向绑定的数据 ，你在data里声明了，然后 页面里使用。在 生命周期和其它方法里 调用 this.xxx（data里的属性）然后页面会自动 更新。你不在data里声明，它是不会变的。

2.创建了一个Vue对象是app，那为什么我用app.data.Data1是错误的呢？
你在 var app的下面 打印试试，别在 app对象里打印

Answer 2

说是对象可能太小看它了，你可以把它理解为当前页面的一个对象存储器和数据存储器。当前页面的所有数据对象都需要在这里面进行时定义

Answer 3

就是页面种所要定义的变量放在data种

Answer 4

data(){
  return {
     param:''//通过 this.param 访问
  }
}

你可以当作 class 来看待，data 是Vue内的一个方法，主要是用来处理响应式数据，new this.data(),拿到返回的对象 obj，对 obj 的每个数据进行 Observer ,将其收集到 deps 内（好久没看，具体何值忘了），大概就是收集依赖，依赖的值来自于data函数，为什么是函数呢，因为如果是对象，可能会复用地址，同一个组件可能存在共用数据的情况，比如你修改了这个组件的值，发现另一个组件的值也发生了变化（同一个组件实例化，一个页面使用了两次）；

Answer 5

你可以吧data当做函数 但是他不是个对象,里面存储了很多数据 ,如果是对象的话调用时,调用的同一个东西,会造成变量污染 ,所以data是一个函数,用来存储对象和绑定数据

Answer 6

双向绑定