Why useState is asynchronous in ReactJS?

The main reason for asynchronous useState is the closure scope around an immutable const value.

We can not do await setState() to make it synchronous. On the very first rendering props and state are assumed to be unchanging.

To achieve this we use const keyword with useState hook.

const [state, setState] = useState('initial');

Between the renders, the value might be different. For a particular render, the value remains constant and of course inside the closures.

Reference: