理解这个问题，得先要能理解js中堆空间和栈空间的使用规则。
栈空间是存放基本数据类型（undefined，null，string，number，Boolean），这些数据占用的内存空间的大小是确定的，并由系统自动分配和自动释放。比如创建变量var a=4;var b=4;改变a的值为3，b的值却不变。因为他们的引用地址不变。这是传值。
堆空间是存放引用数据类型（Object、Array、Function），引用类型的数据的地址指针是存储于栈中的，当我们想要访问引用类型的值的时候，需要先从栈中获得对象的地址指针，然后，在通过地址指针找到堆中的所需要的数据。如果对象直接复制，比如定义一个arr = [1,2,3]，arr1 = arr，arr赋予给arr1的时候传的是栈中的地址（相当于新建了一个不同名“指针”），而不是堆内存中的对象的值。arr、arr1都指向同一块堆内存，arr1修改堆内存的时候，也就会影响到arr。这是传址。
Vue组件中的data，因为组件是可以复用的，如果不用function 返回，每个组件的data 都是内存的同一个地址,一个数据改变了其他也改变了。data是一个函数时，每个组件实例都有自己的作用域，每个实例相互独立,不会相互影响。