React 라이프 사이클에 대한 문제 및 의문 useState.

Package

  "dependencies": {
    "@emotion/react": "^11.10.0",
    "@emotion/styled": "^11.10.0",
    "babel-preset-next": "^1.4.0",
    "framer-motion": "^6.4.3",
    "gray-matter": "^4.0.3",
    "lottie-react": "^2.3.1",
    "next": "^12.3.4",
    "next-mdx-remote": "^4.3.0",
    "prism-react-renderer": "^1.3.5",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^4.10.1",
    "rehype-slug": "^5.1.0",
    "styled-components": "^5.3.5"
  },
  "devDependencies": {
    "@tailwindcss/typography": "^0.5.8",
    "@types/node": "18.0.3",
    "@types/react": "18.0.15",
    "@types/react-dom": "18.0.6",
    "@types/styled-components": "^5.1.25",
    "autoprefixer": "^10.4.8",
    "babel-plugin-styled-components": "^2.0.7",
    "eslint": "8.19.0",
    "eslint-config-next": "^13.0.6",
    "postcss": "^8.4.14",
    "tailwindcss": "^3.1.8",
    "typescript": "4.7.4"
  }

Code

import {useState} from "react";

const Index = () => {
  
  const [isTest, setIsTest] = useState(false);
  
  const testfunction = () => {
    setIsTest(true);
    console.log(isTest);
    if(isTest) {
      console.log("ck OYU ")
    }
  }
  
  return (
    <>
      <button onMouseDown={() => {
        testfunction();
      }}>cking test</button>
    </>
  )
}

export default Index;

관련 문제에 대해 작성중, useState가 정상적으로 출력되지 않는 문제를 발견하였습니다.

useState를 호출하여 값을 변경했음에도 불구하고 처음 변수를 호출시 이전 변수가 출력되는 문제를 격고 있습니다.

output:
(호출)
[Log] false
(호출)
[Log] true
[Log] ck OYU

이에 관련된 문제를 알고 계신분을 찾습니다..