[React] React의 setState는 비동기로 동작한다

이채현

💡 React의 setState는 비동기일까?

function App() {
  const [state, setState] = useState(0);

  const handleClick = () => {
    setState(state + 1);
    setState(state + 1);
    setState(state + 1);
  };

  return (
    <div className="App">
      <p>{state}</p>
      <button
        onClick={() => {
          handleClick();
        }}
      >
        +3
      </button>
    </div>
  );
}

export default App;

위 코드의 결과는 버튼을 눌러도 1씩 증가한다.

이유는?