为什么在React Component构造函数中的console.log（super）会抛出错误？

Question

我想在我的InheritComponent constructor方法中控制super 。 但是在chrome控制台中，它会抛出一个错误。 为什么？

 class BaseComponent extends React.Component{ static defaultProps = { title: 'Learn React By Examples' } constructor(props) { console.log(props); super(props); } setTitle(title) { document.title = title || this.props.title; return document.title; } } class InheritComponent extends BaseComponent{ state = { title: '' }; constructor(props) { super(props); //here throw an Error. Why? I want to console.log `super` console.log(super); } componentDidMount() { const title = this.setTitle('组件继承') this.setState({title}); } render() { return <div> <p>I inherit BaseComponent</p> <p>current title is {this.state.title}</p> </div> } } ReactDOM.render( <InheritComponent />, document.body ) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 

以上是我的演示代码。

Answer 1

原因很简单： super是关键字，不是函数，也不是任何变量。 您无法记录super ，因为您无法记录var或new关键字。

如果要记录父项的构造函数，可以尝试：

console.log(super.constructor);

实际上， super()只是super.constructor()简写。

查看更多： https ： //developer.mozilla.org/pl/docs/Web/JavaScript/Reference/Operators/super

Answer 2

super是一个关键字 ，你不能像变量一样使用它。 MDN文档中概述了唯一允许使用super的方法：

超级（[参数]）; //调用父构造函数。

super.functionOnParent（[参数]）;

如果要打印父类，请改用console.log(super.constructor) 。