简述super()和super(props)有什么区别？
参考回答
super() 和 super(props) 都是在 React 中的类组件中调用父类构造函数的方式，但它们在调用时有一些细微的区别：
super()：不传递任何参数，直接调用父类的构造函数。在 ES6 中，如果你在子类的构造函数中使用了super()，它会调用父类的构造函数并且没有传递任何参数。-
super(props)：通常在 React 组件的构造函数中使用，传递父类构造函数的props参数。React 要求在子类的构造函数中使用super(props)，以便正确地将父类的props初始化到子类中，这样子类组件才能访问this.props。
详细讲解与拓展
1. super() 和 super(props) 的工作原理
- 在 JavaScript 中，
super是用于访问父类构造函数和方法的关键字。通常情况下，我们在子类的构造函数中需要调用super()来初始化父类的部分内容。 - 如果你在子类构造函数中没有使用
super(props)，而直接使用super()，那么this对象在构造函数中将不可用，原因是 JavaScript 的类继承要求在访问this之前必须先调用super()。
2. 区别
-
super()：如果没有传递任何参数，它仅仅是调用父类的构造函数，并且不将props传递给父类。在 React 中，这种做法是不推荐的，因为你将无法正确访问this.props。 -
super(props)：这将会调用父类构造函数，并且把props传递给它。这样子类的实例就能正确初始化this.props，并可以在组件中访问props。举例：
class Parent { constructor(name) { this.name = name; } } class Child extends Parent { constructor(props) { super(props); // 将 props 传递给父类构造函数 this.state = { value: 'test' }; } }这里，
super(props)将props传递给了Parent类的构造函数，确保Child组件能够正确访问和初始化this.props。
3. 为什么要使用 super(props)？
在 React 中，super(props) 是必须的，因为它确保了父类（React.Component）能够正确地初始化 this.props。如果没有调用 super(props)，你将无法访问 this.props，这会导致错误。
举例：
“`javascript
class MyComponent extends React.Component {
constructor(props) {
super(props); // 必须使用 super(props)，确保 this.props 可用
console.log(this.props); // 如果没有 super(props)，此处会报错
}
<pre><code> render() {
return <div>{this.props.name}</div>;
}
</code></pre>
}
“`
在上面的代码中，super(props) 确保了父类 React.Component 构造函数初始化了 this.props，使得子类组件能够正确访问和使用 this.props。
4. 没有 super(props) 会发生什么？
- 如果你在 React 组件的构造函数中没有调用
super(props)，你会遇到以下错误：this未定义：你无法访问this.props，也无法在构造函数中使用this。这是因为在子类构造函数中，访问this前必须调用super()。this.props不可用：React 无法在没有调用super(props)的情况下正确初始化this.props。
举例：
class MyComponent extends React.Component { constructor() { super(); // 这里没有传递 props console.log(this.props); // 这里会抛出错误 } render() { return <div>{this.props.name}</div>; } }这段代码会抛出错误，因为
super()被调用时没有传递props，导致无法正确初始化this.props。
总结
super()：在子类构造函数中调用父类构造函数，但不传递props。在 React 中不推荐使用这种方式，因为它会导致无法访问this.props。super(props)：正确地调用父类构造函数，并将props传递给父类，确保this.props在 React 组件中可用。这个方式是 React 中推荐的做法。