https://ko.react.dev/reference/react/useReducer#usereducer

useReducer is a React Hook that lets you add a reducer to your component.

Reference

useReducer(reducer, initialArg, init?)

Parameteres

• reducer
  • The reducer function that specifies how the state gets updated.
  • It must be pure, should take the state and action as arguments, and should return the next state. State and action can be of any types.
• initialArg:
  • The value from which the initial state is calculated.
  • It can be a value of any type.
  • How the initial state is calculated from it depends on the next init argument.
• optional init
  • The initializer function that should return the initial state.
  • If it’s not specified, the initial state is set to initialArg.
  • Otherwise, the initial state is set to the result of calling init(initialArg).

Returns

useReducer returns an array with exactly two values: The current state.

1. During the first render, it’s set to init(initialArg) or initialArg (if there’s no init).
2. The dispatch function
   1. that lets you update the state to a different value and trigger a re-render.

Caveats

• useReducer is a Hook, so you can only call it at the top level of your component or your own Hooks.
• In Strict Mode, React will call your reducer and initializer twice in order to help you find accidental impurities.

dispatch function

The dispatch function returned by useReducer lets you update the state to a different value and trigger a re-render. You need to pass the action as the only argument to the dispatch function:

• The dispatch function only updates the state variable for the next render.
  • If you read the state variable after calling the dispatch function, you will still get the old value that was on the screen before your call.