What is the primary purpose of a custom hook in React?

What is the primary purpose of a custom hook in React?

• A. To share reusable logic across components
• B. To replace components with hooks
• C. To manipulate the DOM directly
• D. To render components more quickly

Answer: (A)

Custom hooks are a way to share stateful logic across multiple components. They let you take pieces of behavior that involve React features like state or effects and put them into a single function so several components can reuse that logic without repeating code. A custom hook is simply a function whose name starts with use and that can call other hooks inside it, returning values or helpers that components can consume. This approach keeps components focused on rendering while the shared behavior lives in one place, making code easier to read, test, and maintain. It’s not about replacing components with hooks, and it doesn’t by itself make rendering faster or replace DOM manipulation—any DOM work still goes through the usual hooks like useEffect or refs. For example, a hook that handles data fetching, loading state, and error handling can be reused by any component that needs to fetch data, illustrating how custom hooks promote reuse and clean composition.

Custom hooks are a way to share stateful logic across multiple components. They let you take pieces of behavior that involve React features like state or effects and put them into a single function so several components can reuse that logic without repeating code. A custom hook is simply a function whose name starts with use and that can call other hooks inside it, returning values or helpers that components can consume. This approach keeps components focused on rendering while the shared behavior lives in one place, making code easier to read, test, and maintain. It’s not about replacing components with hooks, and it doesn’t by itself make rendering faster or replace DOM manipulation—any DOM work still goes through the usual hooks like useEffect or refs. For example, a hook that handles data fetching, loading state, and error handling can be reused by any component that needs to fetch data, illustrating how custom hooks promote reuse and clean composition.