React 类属性初始化器的优缺点

Question

使用 React，我知道你可以像这样初始化组件状态：

class Foo extends Component {
  constructor() {
    super();

    this.state = { count: 0 };
  }
}

如果 state 需要用 props 初始化：

class Foo extends Component {
    constructor(props) {
        super(props);

        this.state = { this.props.count: 0 };
    }
}

但是，使用transform-class-properties 插件，您可以像这样初始化状态：

class Foo extends Component {
    state = { count: 0 };
}

由于this在构造时指的是class下的实例，所以初始状态仍然可以使用props：state = { this.props.count: 0 }

除了行数更少的明显好处之外，我还想知道这种语法有哪些优点/缺点。

*示例不包括类方法的绑定，因为我知道在使用粗箭头语法声明这些方法时可以完成绑定。

Answer 1

优点：

• 更少的代码，更多的隐含

缺点：

• 您不能像构造函数那样进行任何逐步计算

例如

constructor(props){
  super(props)

  const z = props.x - props.y;
  const g = props.a + props.b;
  const total = z ** g;
  const shouldBeOpened = total > 1000;

  this.state = {
    shouldBeOpened,
    initialSomething: z > g,
  }
}