vue Mutation 必须是同步函数 为什么_为什么vue组件中data必须用函数表达？

今天我就拿我的这篇文章来做个开头吧。

看到这个问题可能很多人都并可以注意过这个问题，问什么在脚手架中的.vue文件中data不能用对象来表达，而是必须使用函数的形式来表达呢？大家可能也不知道为什么这么设计？

实际上这是很有学问的，当初框架设计的时候，都是想了很多可能会出现的问题的。

首先我们做一个类比，如下代码：

对三个不同的变量obj1，obj2，obj3进行赋值，并且都是调用方法abc()，也就是说创建了三个不一样的实例，所以返回的此方法返回的值，就被赋值给了不同的地址。 因此这三个变量的内存地址是不同的，此时改变其中一个变量的值，其他两个变量的值是不会跟随发生改变的。

我们此时在做一个类比，如下图：

我们首先声明一个常量obj(假设被储存在内存地址0x100)，再写一个函数abc()其返回值为刚刚定义的常量obj(返回的值指向地址0x100)。 所以我们对三个变量obj1，obj2，obj3进行赋值abc(),都是指向0x100的地址，此时更改其中一个变量的值，我们就会发现其他两个变量的值也随之改变。如下图解释：

我们回过头来看当前组件

当前组件为，如果我们在实例中多次使用当前组件的话如下：

如果我们把组件里面的data改成一个对象的话，如下图：

data此时是一个对象，里面存放着很多数据，都是指向同一个地址。 此时如果重复的使用相同的当前组件，每一个组件用的值都是从这个data:{}对象中取得（也就是说都是从同一个地址中取值），就对组件之间造成了相互干扰。 同理，我们就可以知道组件中的data使用函数然后返回一个对象的话，就不会存在这个问题了，因为在创建不同组件的时候，会return出不同地址的对象，并不存在干扰组件之间的数据绑定之类的问题