useReducer.md

useReducer

useReducer in general

• CodeSandBox: useReducer and useState counters comparison

• Task: Observe the console.logs:

  1. Hit the Dispatch (copy) button 3 times
  2. Hit the Dispatch (mutation) button
  3. Observe the console.log statements

  Do the log statements make sense to you?

Removing dependencies: values with useReducer hook

• Make entire fetch function into a useReducer function

• Issues: This CodeSandBox

• Problem: step causes too frequent set/clear interval calls! step unrelated to interval. How to remove it?

• Tricky: Updater function optimization already present..

• Exercise: Start with CodeSandBox: this to implement reducer function

• CodeSandBox: Solution with useReducer

• Note: useState is implemented with useReducer using a basicStateReducer. So all things we learned about useState also apply here.

• useReducer uses the Object.is comparison operator.