First things first, this blog post is an extension of the demo project that showcases the 3 ways to initialize state in React Component. This project source code is open-sourced in Github (karthiks/simple-counter-react-demo) for your reference and toying with it.
The 3 ways are:
- Class Component that uses constructor to initialise state.
- Class Component that uses static/class property to initialise state.
- Functional Component (aka Function) that uses React Hook viz. useState to initialise state.
In the mean time, React introduced easier way to define stateless components with just functions. These are called Stateless / Functional Components. And with time React also introduced React Hooks. One of the hooks were useState that hooks state into a component. With the advent of this, the community started to leverage this one over the above methods.
Your mileage and preference may vary. This project is aimed to help you decide the flavor you prefer and start adopting.