Declaration |
These are nothing but JavaScript Functions. So, you declare it in the same manner as the JavaScript function. |
On the other hand, class components are declared using the ES6 class. |
Handling Props |
Handling props is very straightforward. You can use any prop as an argument to a functional component that can be directly used inside HTML elements. |
For class components, the props are handled differently. Here, we make use of the “this” keyword. |
Handling State |
Functional components use react hooks for handling state. |
For the class components, we can't use the hooks, so for this case, for handling the state, we make use of a different syntax. |
Constructor |
For the functional components, constructors are not used. |
For the class components, constructors are used for storing the state. |
Render Method |
In the functional component, there is no use of the render() method. |
In the class component, it must have the render() method. |