javascript - React Component 中状态定义的语法有本质区别吗？

Question

在 React 组件中定义 state 是否有任何区别(语法除外)(参见下面的示例，在类和构造函数中)？

在 JS 内存分配、内存管理、JS 性能、内存泄漏、垃圾回收等方面的差异？

我通常在constructor 中定义state。但是查看其他人的代码我看到他们在类范围内定义状态。

class Button extends React.Component {
    // this style vs. ...
    state = {
        color: 'red'
    }

    constructor(props) {
        super(props)

        // ... vs. this style
        this.state = {
            color: 'red'
        }
    }
}

Answer 1

在构造函数之外初始化实例属性是 EcmaScript 下一版本的提议语法。它是 official stage 3 proposal 的一部分.

根据这个提议，下面的片段:

class MyClass {
    constructor() {
        console.log("Hello from constructor!");
        this.x = 1;
    }
}

可以缩短为:

class MyClass {
    x = 1;

    constructor() {
        console.log("Hello from constructor!");
    }
}

声明和初始化属性 x 的语法与示例中的属性 state 相同。