What Are Component Props?

Another way to think about component props is that they are the configuration values sent to a component. If you look at the non-JSX version of the previous code example it should be obvious component props are just an object that gets passed to the createElement() function (i.e., React.createElement(Badge, { name: "Bill" })).

In the previous code example examined in this section, the component uses two Badge components each with their own this.props object. We can verify this by console logging out the value of this.props when a Badge component is instantiated.

Basically every React component instance has a unique instance property called props that starts as an empty JavaScript object. The empty object can get filled, by a parent component, with any JavaScript value/ reference. These values are then used by the component or passed on to child components.

Notes