最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Constructor(props) and super(props) VS constructor() and super() in React - Stack Overflow

programmeradmin3浏览0评论

I know that this question was asked many times, but it is still doesn't clear. Many people just said:

Pass props to constructor if you want to access this.props there

one more example of the answer

Oficial doc says Class ponents should always call the base constructor with props. , but if we do not pass props to constructor, we will still have this.props everywhere exept constructor.

Also from react source code we can see source code of the React.Component function ReactComponent(props, context) { this.props = props; this.context = context; }

But it is confuses me even more. super() should be called with two parametrs: props and context . But we invoked our super empty and still have access two this.props. According to ECMA documentation super() invokes parent constructor() with parametrs passed to super() . But our super() is empty.

So my questions are:

  1. Why official docs says:

Class ponents should always call the base constructor with props.

  1. How React set props to child ponent if super() and constructor() is empty?
  2. Is it bug of feature of the React that props are accessible in child ponent without passing props to super() and constructor()?

I know that this question was asked many times, but it is still doesn't clear. Many people just said:

Pass props to constructor if you want to access this.props there

one more example of the answer

Oficial doc says Class ponents should always call the base constructor with props. , but if we do not pass props to constructor, we will still have this.props everywhere exept constructor.

Also from react source code we can see source code of the React.Component function ReactComponent(props, context) { this.props = props; this.context = context; }

But it is confuses me even more. super() should be called with two parametrs: props and context . But we invoked our super empty and still have access two this.props. According to ECMA documentation super() invokes parent constructor() with parametrs passed to super() . But our super() is empty.

So my questions are:

  1. Why official docs says:

Class ponents should always call the base constructor with props.

  1. How React set props to child ponent if super() and constructor() is empty?
  2. Is it bug of feature of the React that props are accessible in child ponent without passing props to super() and constructor()?
Share asked Nov 22, 2017 at 20:06 mr__brainwashmr__brainwash 1,3823 gold badges20 silver badges46 bronze badges 5
  • 1 A promise: constructor(...args) { super(...args); } – zerkms Commented Nov 22, 2017 at 20:08
  • 4 Why are you viewing such outdated source code? – Andrew Li Commented Nov 22, 2017 at 20:11
  • github./facebook/react/blob/master/packages/react/src/…: createElement adds props regardless if you use super(props). – Andrew Li Commented Nov 22, 2017 at 20:18
  • @ Li357 Thanks for the link to the new source code. So current React doc is wrong or what? There is no need to call constructor always with props ? – mr__brainwash Commented Nov 22, 2017 at 20:41
  • Sorry, but does anyone know the answer? – mr__brainwash Commented Nov 27, 2017 at 13:58
Add a ment  | 

2 Answers 2

Reset to default 3

Here is an answer from Dan Abramov:

But if we do not pass props to constructor, we will still have this.props everywhere except constructor.

Yes, React sets this.props anyway after the constructor runs. Still, it is confusing to have this.props work in some places and not others. Especially if both constructor and other methods call some shared method that reads this.props. So, to avoid any potential confusion, we remend always calling super(props).

Also from source code of Create Element you can see that createElement adds props regardless if you use super(props)

createElement() has no relation to this question. It creates an element, not an instance.

So, to get back to your question, technically it's only necessary if you plan to access this.props in the constructor or any method you call from constructor. However it's pretty confusing to have to remember this. You might know about it and not call super(props), but the next person on your team will want to access this.props in a constructor and will be surprised it doesn't work. It's just easier to always specify it to avoid these problems.

If no constructor is defined in the code for a react ponent you can assume it will be automatically bound behind the scenes, such as:

constructor(props){
    super(props);
}

Once you have explicitly defined a constructor you must remember to always put that code in otherwise it will be left out... you are basically just overriding a default method :)

发布评论

评论列表(0)

  1. 暂无评论