React Hooks useCallback Hook

Question 1

What does the useCallback hook primarily do in React?

Accepted Answer

It memoizes a callback function so it only changes if its dependencies change

Answer

useCallback returns a memoized version of the callback that only changes when one of its dependencies has changed, preventing unnecessary re-renders.

Question 2

What is the correct syntax for using useCallback?

Accepted Answer

useCallback(fn, [deps])

Answer

useCallback takes a callback function as its first argument and a dependency array as its second argument.

Question 3

When is it most beneficial to use useCallback?

Accepted Answer

When passing a callback function as a prop to a child component wrapped in React.memo

Answer

useCallback is most useful when passing callbacks to child components wrapped in React.memo, preventing unnecessary re-renders when the parent re-renders.

Question 4

What happens if you pass an empty dependency array [] to useCallback?

Accepted Answer

The callback is memoized once and never changes

Answer

An empty dependency array means the memoized callback has no dependencies, so it's created once on mount and remains the same reference throughout the component's lifetime.

Question 5

What is the key difference between useCallback and useMemo?

Accepted Answer

useCallback memoizes a function itself; useMemo memoizes the return value of a function

Answer

useCallback(fn, deps) is equivalent to useMemo(() => fn, deps) — useCallback returns the function, while useMemo returns the computed result of calling the function.

React Practice Test

React Practice Test

React Hooks useCallback Hook