Component Lifecycle
In React, components go through different stages during their lifecycle, from creation to removal from the interface. These stages are divided into three main phases: mounting, updating, and unmounting.
During the mounting phase, the component is created and inserted into the DOM. Here, the constructor() method is called to initialize the state and define properties. Then, the render() method is invoked to render the component on the screen.
During the updating phase, React updates the component in response to changes in props or state.
Here, methods like componentDidUpdate() are called after the component is rendered again. This allows performing actions after the update, such as HTTP requests to fetch updated data.
Finally, in the unmounting phase, the component is removed from the DOM. The componentWillUnmount() method is called before this happens, allowing for cleanup or unsubscribing from event listeners.
For example, imagine a counter component that displays the number of clicks on a button. During the lifecycle, it would be mounted, updated each time the button is clicked, and finally unmounted when it is no longer needed, freeing up resources and memory.
