Question

我想在super InheritComponent方法中安装constructor。但是在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是关键字，您不能像变量一样使用它。唯一允许使用super的方法是概述in the MDN documentation for it：

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

super.functionOnParent（[参数]）;

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

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

2 个答案: