React is Simple!
Think React state is easy? One wrong move and your counter breaks.
Why It Happens
React batches state updates.
Using setState(state + 1) can overwrite updates with stale values.
The functional form setState(prev => prev + 1) ensures correctness.
Don't
const [count, setCount] = useState(0);
setCount(count + 1);
setCount(count + 1);
// ❌ Result: count = 1Do
const [count, setCount] = useState(0);
setCount(prev => prev + 1);
setCount(prev => prev + 1);
// ✅ Result: count = 2Explanation
setCount(count + 1)→ uses an old snapshot of state.setCount(prev => prev + 1)→ React passes the freshest value.
Updating state without prev is like asking for “one more slice” 🍕…
but the box already got emptied. Always ask from the current box.
