Jtdcftul

In the tutorial published by reactjs.org, it was stated that "Class components should always call the base constructor with props". In my own research, it seems that super(props) can be replaced by super() if this.props is not used in the constructors, according to this StackOverflow answer.

Therefore, my question is, why should we always pass in props to base constructor in reactjs? Is the advice sound? Why is it sound (or not sound) advice?

P.S. A screenshot is uploaded to this question just in case the original tutorial is updated while this question is being answered.

Although it is suggested to pass props to super but it isn't
strictly necessary.

Passing it just helps in an odd situation where you might have a called a method in constructor and then at some point of time in future decided to use props in it. Now since props aren't available in the constructor since you haven't passed props to super, it would result in an error. This kind of situation might be tricky to debug and hence its recommended to pass props always whenever you write a constructor so that it ensures this.props is set even before the constructor exits.

This is because you are initializing the parent component React.Component e.g. this.props will be undefined. You can find detailed explanation for why we are using it in blog by Dan Abramov, react engineer

It is not necessary Is super necessary?

since class Clock extends React.Component, you can access all the properties and methods of React.Component.

By calling super, you are actually calling the parent element with props parameter

If you intend on using this.props inside the constructor, you have to call super(props)

In JavaScript, super refers to the parent class constructor.

Why do we call super? Can we not call it? If we have to call it, what happens if we don’t pass props? Are there any other arguments?

Read the article that is linked below to get the answers for the above questions.

Read the article from Dan Abramov (Works at React JS team)

In simple words,

You don't necessary have to pass props in constructor or super , You can directly use this.props and it will still work.

You only need to pass props in constructor and super when you call a method inside constructor from which the value is from a prop.

In simple words, its used to call your parent class constructor which is very much required, when calling super(), it actually calls the parent class constructor and also in
ES class constructor must have super() when its a subclass andsuper() is required only when you have a constructor explicitly.

Super() not required

class TestApp extends React.component{

   render(){

      return <div>I don't need a super()</div>

   }

}

Super() required

class TestApp extends React.component{

   constructor(){

     super(); // here super is required becuase it calls the parent class constructor //

   }



   render(){

      return <div>I don't need a super()</div>

   }

}

Using super() you can also pass props super(props) to the parent class, in this case, props will be accessible across components via this.props.