vue2 中函数的定义怎么不一样呢？

Question

问题描述

刚学vue2，学的有点蒙，组件的data必须是方法，该定义方法如代码1所示

代码1：

//方法1
data: function () {
  return {
    count: 0
  }
}

而在vue中methods里面定义的方法如代码2所示
代码2：

...
methods: {
    //方法2
    routeChange () {
      console.log('test')
    }
  },

同样是定义为啥方法1和方法2定义的方式不一样嘞？
emm...我也想百度，但是不知道从何问起呐，所以特意来此求助，emm...初入前端，问的太弱智请见谅，若有知道的麻烦给解答一下，非常感谢^-^### 问题描述

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

你期待的结果是什么？实际看到的错误信息又是什么？

Answer 1

这个问题应该是js语法.js中函数是一种变量类型,因此函数可以用如下两种语法来定义:
1, function test(){}
2, var test=function(){}

由此可知,对于对象的一个成员赋值,

var obj={test1(){},test2:function(){}}

obj的两个成员test1和test2是等效的.至于为什么vue是那么写,我理解是对于data,他的名字是规定的,用data:function(){}表示更为严谨,至于方法名,这个是任意取的,所以,采用更为自由的方式.实际上,我自己写方法名的时候也都是采用methodName:function(){}这种方式,个人习惯问题吧.

Answer 2

data设计为方法是因为不想多个组件同时操作data的引用（比如组件继承），所以data是一个function，执行返回才是真正的数据。

Answer 3

两者作用是一样的，另外，我习惯写成

data () {
  return {
  }
}