As described in this lesson. React is a JavaScript object which contains methods to use the react. And it also says that React.Component is a class. My question is can an object contain a class as it’s property?
An object can have class instances as the values of their properties, but one doubts that it can have a class as a property. Its parent class can have a parent class that it inherits from, or it can have child classes that inherit from it.
A module can contain multiple classes. React.js is a module, if I’m correct in my understanding.
If I’m understanding your question correctly, then the answer is yes. Here is a small example I wrote to demonstrate and to make sure I’m not misunderstanding.
import React from "react";
import ReactDOM from "react-dom";
class App extends React.Component {
render() {
return <h1>Hello, World</h1>;
}
}
// Store the uninstantiated class in the object
const myClasses = {
theAppClass: App
};
// JavaScript still lets us extend it using that name if we want
class LoudApp extends myClasses.theAppClass {
render() {
return <h1>{this.props.message && this.props.message.toUpperCase()}</h1>;
}
}
// We can use it in JSX by referencing the object property
ReactDOM.render(
<div>
<myClasses.theAppClass />
<LoudApp message="hello, world" />
</div>,
document.getElementById("app")
);
The browser would show:
Does this demonstrate what you mean? Please let me know
I was going to ask the exact same thing! I just tried to complete the lesson’s exercise creating the function using the arrow function syntax but it did not accept it as a possible correct answer. It complained about not using the function keyword.
I am also wondering whether we can use arrow function syntax in React? I tried to do it in the previous project (Animal Facts) and it didn’t work, so I’m presuming we can’t use it?
Arrow functions are not as robust as standard functions and have none of the built-in properties such as, this or arguments, the former being most likely used at some internal level. If the docs say not to use them, then it would do well to follow that advice. No explanation necessary. We just have to accept that it is the way it is.
) below!
) to up-vote the contribution!
