How to use React's useState to modify the value of a constant?

Question

This is the syntax I'm using.

const [count, setCount] = useState(0);
const handleIncrement = () => {
    setCount((count + 1));
  };

I understand that setCount is creating an instance of count, but I really don't understand how it is changed if count is a constant, or how it is called and returns the latest value if it is an instance.

Every time React re-renders the page, doesn't it read the constant count first?

Everything looks normal to me, but I can't understand why.

Answer 1

count is "constant" during the execution of the function. When setCount() is called, the local count will not change. Eventually, your component will re-render with the new values.

During this new render pass, count will be updated, but it will remain constant during the execution of the render/function.