![]() Previously Class components were used as container components to handle state management and wrap child components and Functional components were generally used for display purposes as they did not have state management support but after the release of Hooks we can say functional components are the future of React Native development.Ĭlass components are not deprecating but due to the many performance improvements in the functional component React Native team also suggested using the functional component over class components. If you have doubts related to the useSate or useEffect then please wait and keep visiting AboutReact as I am going to post some content soon to help you understand the hooks. There are also many other small differences which you will get to know once you start using functional components. These are the main differences that I can think of. We are very much familiar with the class component Lifecycle methods but in case of functional components we have to manage all this with the help of useEffect hook.Įxample of Lifecycle Methods for Class ComponentĮxample of useEffect Hook for Functional Component LifeCycle methods give us the power to control the data and application flow on different activities. We all know how important is the Lifecycle methods while developing any React Native application. Lifecycle Methods/HooksĪnother most important difference in Class and functional component is the lifecycle methods or you can say Lifecycle Hooks. While managing the state in classes we use setState and this.state to set and get the state respectively but in the functional component we have useState hook after the update of React 16.8. A functional component looks like a plain JavaScript function.Ī class component requires you to extend from React.Component and create a render function that returns a React element. The most obvious difference is the syntax. Easier to read and understandįunctional components are very easy to read and understand which is also a positive point as easy to understand means easy to test and debug. Fewer linesįunctional components transpile down to less code than class components, which means functional components will create smaller bundles. So we can say that with functional components we will have a cleaner, clearer code. ![]() It’s always advantageous if you don’t have to use ‘this’ when writing your Javascript code.Īnother bonus is, not having to use ‘this’ means that we also don’t have to use bind, which is an even more confusing concept. No Class means no ‘this’Īs a javascript developer, we all know how tough it is to handle ‘this’.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |