React - 构造函数

Question

我正在尝试学习React。

React文档中说要按以下方式传递构造函数参数。

class Clock extends React.Component {
  constructor(props) {
    super(props);
    this.state = {date: new Date()};
  }


  render() {

这篇文章称，在该函数中引用 super 的原因是，如果您想在构造函数中访问 this.props，则可能需要在super()中具有props。

但是 - 如果您不需要这样做，只需要初始化状态，您是否仍然需要 super() 语句？

我看过很多教程，它们将其定义为以下内容：

class Basic extends React.Component {
  state = {
    selectedValue: null,
    createdAt: null
  };

我找不到为什么这是可以接受的的参考资料。即使构造函数不需要props，你是否还需要super？

- Mel

---

如果您从未使用过 props (this.props)，那么您就不需要编写 super(props)。这是不必要的。 - Ryan Nghiem

你需要super()吗？ - Mel

我正在尝试理解constructor(props)以及它是否在具有状态的类中是必需的。 - Mel

@ShubhamKhatri - 更好的问题是已经有答案的问题。如果您能在您的标记中链接到它，那将会很有帮助。 - Mel

https://dev59.com/GVoU5IYBdhLWcg3wIkeI - Shubham Khatri

Answer 1

该片段使用 class fields proposal。

class Comp extends React.Component {
  this.state = {...};
  ...
}

是语法糖，用于

class Comp extends React.Component {
  constructor(props) {
    super(props);
    this.state = {...};
  }
}

如果一个类不需要显式构造函数，则可以省略constructor。如果它需要显式的构造函数，则应该包含super(props)，因为这是必要的，以便正确从React.Component继承。

- Estus Flask

---

请继续阅读。它解释了你提到的第一个示例是解糖化的ES2015，而第二个示例是甜化的ES.next，并用x =替换了this.x =。 - Estus Flask

你是指这段话吗：“在上面的例子中，您可以看到使用语法x = 0声明了一个字段。您也可以声明一个没有初始化器的字段作为x。通过提前声明字段，类定义变得更加自我记录；实例经历的状态转换更少，因为已声明的字段始终存在。”？如果是这样，那么我在哪里可以找到翻译指南来弄清楚这个术语？ - Mel

“Fields”在提案本身中有定义，https://tc39.github.io/proposal-class-fields/。其余似乎是常规的编程术语。对我来说，片段之间的区别不言自明。`this.x =变成了x =`。 - Estus Flask

你是在说React文档被常规编程发展所取代吗？ - Mel

React文档是由不同的贡献者在不同的时间编写的。我无法说为什么会有constructor(props) { super(props);，可能是为了让读者对类字段不熟悉（在React工具链中支持但尚未标准化且不是有效的JS）的情况下更好地理解正在发生的事情。无论如何，几乎可以跳过所有组件的constructor，包括这个，这也避免了非常常见的错误，即constructor(props) { super() }（没有超级的props参数）。 - Estus Flask

Answer 2

这个要求与React无关，它与新的ECMAScript 2015类有关。

请查看这篇Mozilla文章中的继承语法部分；

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Inheritance#Inheritance_with_class_syntax

当你创建一个新的React组件时，你需要继承自React.Component类。因此，如果你需要为你的类定义一个构造函数，你需要调用super，否则不需要。

- Metehan Senol

---

我正在尝试弄清楚何时需要定义构造函数。 - Mel

绝对是的。请看上面的文章。 - Metehan Senol

这与你是否需要构造函数无关。我想说的是，如果你从父类继承并且需要构造函数，那么你必须调用super。当你编写一个类并且不继承任何父类时，因此你不需要调用super，但你仍然可以定义构造函数。 - Metehan Senol

没问题。抱歉，我写得有点粗心。我已经再次编辑了我的评论。 - Metehan Senol

如果问题是“何时需要构造函数？”，那就涉及到你的业务。 - Metehan Senol