useReducer is very similar to useState, but it lets you move the state update logic from event handlers into a single function outside of your component.
useReducer is a React Hook that lets you add a reducer to your component state.
reducer: The reducer function specifies how the state gets updated. 
- It must be pure, should take the state and action as arguments
 - It should return the next state. State and action can be of any type.
 
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 initialiser 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).
 
useReducer returns an array with exactly two values:
- The current state. During the first render, it’s set to init or initialArg (if there’s no init).
 - The dispatch function lets you update the state to a different value and trigger a re-render.