在 React 中使用类的目的是什么？

Question

我主要看到 JavaScript 使用类作为构造函数，如下所示：

class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
  // Getter
  get area() {
    return this.calcArea();
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}

React 使用类而不使用contructor()函数的原因是什么，例如以下？我没有看到类用于创建实例。

class App extends Component {

    render() {
        return (
            <div className="app-content">
            </div>
        )
    }
}

Answer 1

现在，如果您需要使用shouldComponentUpdate()诸如之类的“高级”组件生命周期方法，您应该在 React 中使用类。

以前类组件用于处理其中的本地状态。现在我们有Hooks API，它允许以更优雅的方式使用状态并且不需要类组件。

如果您想了解更多详细信息，可以阅读 Dan Abramov 的文章：函数组件与类有何不同？.

不管你的例子，你是对的，这段代码：

class App extends Component {

    render() {
        return (
            <div className="app-content">
            </div>
        )
    }
}

可以写成：

function App() {
  return <div className="app-content"></div>
}

Answer 2

contructor()React 使用类而不使用函数的原因是什么

来自JavaScript课堂文档：

如果不指定构造函数方法，则使用默认构造函数。

因此，无论是否指定构造函数方法， constructor 每个都存在a 。class

我没有看到类被用来创建实例。

React作为类实现的组件在渲染过程中被实例化。React

具体来说，在新React Fiber创建类组件的实例时React发生在源代码的这一行。

但是，是的，@vicondin 是对的，问题中的简单组件可以实现为函数组件，类组件曾经是维护状态、实现生命周期方法等的唯一方法，而新的Hooks使之成为可能到...

无需编写类即可使用状态和其他 React 功能。