【译】为什么要写super(props)

译注：

原文地址 https://overreacted.io/why-do-we-write-super-props/

正文

我听说Hooks是新的热点。好笑的是，我想通过描述一些关于class组件的事实来作为第一篇博客。这个想法怎么样！

这些陷阱对于有效的使用React并不重要。但是如果你喜欢深入挖掘运行机制，就会发现这些东西的又去之处。

下面介绍第一个。

我写过很多次 super(props) 但很多情况下，我并不了解为什么要写它。

class Checkbox extends React.Component {
  constructor(props) {
    super(props);
    this.state = { isOn: true };
  }
  // ...
}

当然，class fields 提案让我们可以跳过这步操作。

class Checkbox extends React.Component {
  state = { isOn: true };
  // ...
}

之前计划的一种支持plain class的语法(注：即类变量)，已经在2015年，React0.13版中加入。在class fields完整确定之前，定义 constructor 和调用 super(props) 被当做一种临时方案。

但是，让我们回到只使用ES2015的例子里：

class Checkbox extends React.Component {
  constructor(props) {
    super(props);
    this.state = { isOn: true };
  }
  // ...
}

为什么要调用 super？ 能不能不用它？如果不得不用它，在调用它时，发生了什么？还有其他的参数吗？

---

在JavaScript里，super指向父类构造器。（在我们的例子里， 他指向React.Component实现类）。

重点在于，如果调用了父类构造器，在调用super之前，无法使用this关键字。JavaScript不允许这么干。

class Checkbox extends React.Component {
  constructor(props) {
    //