Nika Kurashvili
Nika Kurashvili

Reputation: 6462

why useCallback is the same instance

 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 ?

Upvotes: 2

Views: 70

Answers (1)

Quentin
Quentin

Reputation: 943480

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.

Upvotes: 1

Related Questions