React类

Question

用const声明的函数和没有let或const声明的函数和在ES6类中声明的函数之间的区别是什么？

class App extends Component {

    submitFood = () =>{
        // some code
    }

为什么上述工作正常，但下面的声明会出错：

class App extends Component {

    const submitFood = () =>{
        // some code
        }

Answer 1

首先：您提供的示例都不是有效的ES6。 The grammar rules for ES6 classes仅允许类主体内的方法定义。即。

class MyClass {
  method1() {}
  method2() {}
}

然而，第一个例子是使用class fields proposal。该提议扩展了现有语法，以允许定义表单属性

class MyClass {
  someProperty = value;
}

这些赋值不会在类定义时计算，而是在实例化时计算。它是用于在构造函数中分配属性的语法糖：

class MyClass {
  constructor() {
    this.someProperty = value;
  }
}

您的第二个示例只是无效的语法，因为没有语法规则允许在类字段之前放置let或const。

请记住，类字段是不是变量声明或变量赋值。

Answer 2

const submitFood = () =>{ // some code }

功能(submitFood=() {})的创建和变量托管let和const变量托管中通常的规则创建。
所以失败，因为submitFood()没有定义。 （它会抛出一个ReferenceError）。