Why when using useState() do multiple entries get displayed in the console when I console.log the current state?

**strong text**strong text

import React, { useState } from "react";

const Counter = () => {
  let [currentCount, setCurrentCount] = useState(0); 
  console.log(currentCount); // logs 4 entries in the console on page reload 

function handleClick() {
    setCurrentCount(currentCount + 1);
   console.log(currentCount);   // logs 2 entries in the console when button is clicked
 }
  return (
    <div>
      <button onClick={handleClick}>+1</button>
      <div>{currentCount}</div>
    </div>
  );
};
export default Counter;