why useCallback is the same instance

user_10046099 0
Viewed 59
 let [myValue, setValue]  = useState(30);

  let k = {};
  let z = {};

  const a = useCallback(() => {
    return myValue + 10;
  }, [myValue]
  )

  k = a;

  setTimeout(() => {
    setValue(60)
  }, 2000)
  
  setTimeout(() => {
    z = a;
    console.log(z == k);
  }, 4000)

This is my react code.

It seems like in the final setTimeout, z is k and prints true. I don't understand why..

in 2 secs, I change myValue which should cause re-rendering which should cause calling useCallback and returning different instance of a. Any idea why it's printing true in the last setTimeout ?

react-native reactjs javascript
1 Answers

myValue isn't a prop or a state value, it is a straight-forward local variable.

Assigning a new value to a variable doesn't trigger a rerender.

If it did trigger a rerender then you would call setTimeout twice more and each rendering of the component would have its own set of k, z, etc which the functions you pass to setTimeout would close over.

Dorward_190680
Related