Vue源码

为什么data是函数，而components是对象？

data函数如果没有返回值会报错吗？

为什么props定义的数据不能和data同名?

vue源码路径：vue\src\core\instance\state.js

// proxy data on instance
  const keys = Object.keys(data)
  const props = vm.$options.props
  const methods = vm.$options.methods
  let i = keys.length
  while (i--) {
    const key = keys[i]
    if (process.env.NODE_ENV !== 'production') {
      if (methods && hasOwn(methods, key)) {
        warn(
          `Method "${key}" has already been defined as a data property.`,
          vm
        )
      }
    }
    if (props && hasOwn(props, key)) {
      process.env.NODE_ENV !== 'production' && warn(
        `The data property "${key}" is already declared as a prop. ` +
        `Use prop default value instead.`,
        vm
      )
    } else if (!isReserved(key)) {
      proxy(vm, `_data`, key)
    }
  }

可以看到先获取data的key，然后再去调用hasOwn方法去判断methods和props里面是否有重复的key，有的话就会发出警告。最后都通过了之后就会调用proxy(vm, '_data', key)，用封装的proxy方法对vm实例做了一层代理，使得我们可以直接通过this直接调用key