React JS Hook

  • React Hooks are a feature in React that allow you to add state and side effects to functional components.
  • Prior to the introduction of hooks, state and side effects were only possible in class components.

Here is a table of some of the most commonly used hooks in React along with a brief description:

Hook NameDescription
useStatebasically it adds state to functional components.
useEffectAdds side effects to functional components, such as data fetching API calls or updating the DOM.
useContextAccesses context values in functional components and give to children component.
useReducerUses a reducer to manage state updates in functional components. used in Redux.
useMemoMemorizes the output of a function to avoid re-computing it if its inputs haven’t changed for better performance
useCallbackReturns a memoized callback function.
useRefCreates a mutable ref object that can be used to access the DOM or other values outside of the component’s render scope.
useImperativeHandleAllows customizing the instance value that is exposed to parent components when using ref.
useLayoutEffectRuns an effect immediately after changes to the DOM are flushed to the screen.

These are just a few of the hooks provided by React. There are additional hooks available, including those for handling forms, gestures, and more. We will see some of them in next tutorials.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top