本文从Vue.js的官方中文文档来逐行分析看看Vue.js的数据对象——data

官方文档地址

文档之一：

分析一：

首先，data的类型可以是Object

其次，组件（component）里的定义的data必须是方法类型的，至于为什么接下来会介绍到；

文档之二：

分析二：

在上图的实例中，app的data对象中有五个属性，分别是：

<code>newTodoText，visitCount，hideCompletedTodos，todos，error</code>

Vue会把这五个属性转化为getter和setter来控制访问对象app的属性，以第一个属性newTodoText为例设置了getter和setter：

文档之三：

分析三：

这个好理解，就是你可以在data中可以定义属性时在属性名开头加上下划线“_”或者美元符号“$”，就不可以直接访问，

           

此时图一会报错，显示 _first is not defined ，图二才是正确姿势

文档之四：

分析四：

这就是分析一要解决的问题了，为什么组件（component）里的定义的data必须是方法类型，原因就是在此，在工程中，每个组件都有可能用来被创建多个实例，而这个组件的实例他们的属性是不能共用的！意思是组件A的属性改变不能引起组件B的同一属性改变，结合原型链知识很容易就能想清楚