小程序JS中 x:function(){} 和 x(){} 的写法有什么区别？

Question

刚入小程序不久，有个问题一直困扰着我。

我一开始在js中一直用下面的这种方式写

xxx:function(){
...
}

后来我看教程视频的时候，都是直接写

xxx(){
...
}

再后来我把我的代码都改成了

xxx(){
...
}

发现没有任何区别一样可以运行。

有哪位专家可以讲解一下，这两种方式都叫什么？有什么区别？谢谢🙏

Answer 1

百度搜索关键词 函数的两种声明方式 即可找到对应的解释。

// 1.利用函数关键字自定义函数(命名函数)
xxx(){
...
}
// 2.函数表达式(匿名函数)
xxx:function(){
...
}

我的理解是这样的。

let a = {
  /** (method) x(): void 定义了一个名为x的方法 */
  x() {
    console.log(this);
  }
}
let b = {
  /** (property) x: () => void 定义了一个属性x给它赋值了一个匿名函数 */
  x: function () {
    console.log(this);
  }
}