function A !== function A

Suppose there are two functions which have the same shape.

If we compare them, the result will show they are different because they have different address.

function fn1() {
  return 1;
}
function fn2() {
  return 1;
}

console.log(fn1 === fn2); // false

Rerendering in React Changes Function Addresses

Please check this by the example below.

useCallback

Let's suppose a stuation.

---

There is a useEffect. It is dependent on a function and inside it, there is a code to call the function.

The function takes a lot of time to be executed and the function is dependent on specific variables or constants

---

In the situation above, it is good to make that function not be called when rerendering by changes of other variables or constants.

Please check the below example to see how it works.