Vue核心面试题：为什么Vue组件中的data是一个函数（而不是一个对象）

<script>
  export default {
    data() {//data是一个函数，data:function(){}的简写
      return {
       //页面要初始化的数据
        disabled: true,
        isArrowdown: false,
        submenuName: '',
        childName: '',
        sideName: '',
        indexData: [],
        menuBarRouter: []
      }
    }
  }
</script>

vue中的组件是可以复用的（也就说是可以共享的），但组件中的data数据是私有的，为了防止data数据复用，将其定义为函数，避免组件与组件之间共享一份data数据。

原因：

（1）在Vue当中，一个组件被创建好之后是可以被复用的，一个组件它可能在很多个地方被复用（用到），不管这个组件被复用到哪个地方或者是被复用了多少次，那么组件中的data数据都应该是相互隔离、相互独立、互不影响的。

（2）假如我们把组件中的data数据以单纯的对象形式表示的话，那么各个组件实例之间就会共享一份data数据，继而就会导致一个组件上的数据发生改变，其他组件上的数据也会跟着改变。

（3）假如我们把组件中的data写个一个函数并把data中的数据以函数返回值的形式定义，那么每复用一次组件就会返回一份新的data，相当于给每个组件实例创建了一个私有的数据空间，每个组件实例都有自己的作用域并且相互独立，各自维护各自的数据，互不影响，这样的话，一个组件上的数据发生改变也不会影响到其他组件上的数据。

最后

以上就是简单白云为你收集整理的Vue核心面试题：为什么Vue组件中的data是一个函数（而不是一个对象）的全部内容，希望文章能够帮你解决Vue核心面试题：为什么Vue组件中的data是一个函数（而不是一个对象）所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。