Vue组件中的data为什么必须是个函数，而vue的根实例没有这个限制

第一个问题：组件中的data为什么必须是个函数

简单直接的方法是从源码找答案，src/core/instance/state.js 112行，initData()方法里面，每次函数执行都会返回一个全新的data对象，若不是函数（程序甚至无法通过vue检测）则返回同一个data，所以如果组件中的data不是函数，在多组件中则会造成状态污染

function initData (vm: Component) {
  let data = vm.$options.data
  data = vm._data = typeof data === 'function'
    ? getData(data, vm)
    : data || {}
  if (!isPlainObject(data)) {
    data = {}
    process.env.NODE_ENV !== 'production' && warn(
      'data functions should return an object:\n' +
      'https://vuejs.org/v2/guide/components.html#data-Must-Be-a-Function',
      vm
    )
  }

第二个，vue的根实例没有这个限制

因为根实例也就只有一个，不存在这种情况

结论

Vue组件可能存在多个实例，如果使用对象形式定义data，则会导致它们共用一个data对象，那么状态变更将会影响所有组件实例，这是不合理的；采用函数形式定义，在initData时会将其作为工厂函数返回全新data对象，有效规避多实例之间状态污染问题。而在Vue根实例创建过程中则不存在该限制，也是因为根实例只能有一个，不需要担心这种情况。