const 위치 관련 질문.

안녕하세요,

아무래도 처음하는 공부라서 굉장히 기초적인 부분에 대한 질문인것 같습니다.

import {Switch, Route, Link, useHistory} from 'react-router-dom';
import UploadPage from "./upload";
import ProductPage from "./product";
import {Button} from "antd";
import {DownloadOutlined} from '@ant-design/icons'

function App() {
  const history = useHistory();
  return (
   <div>
     <div id="header">
      <div id="header-area">
        <Link to="/">
        <img src="/images/icons/logo.png"/>
        </Link>
        <Button size="large"          
          onClick={function(){
              history.push('/upload');
          }}
          icon={<DownloadOutlined/>}
          >상품 업로드
        </Button>
      </div>

위 부분에서 const history= useHistory(); 가 왜 꼭 return 구분 밖에 있어야하는지 궁금합니다.

return 이 되어 표출되는 곳이 시작하기 전에 const가 정의 되야 return구분이 실행되면서 해당 const부분이 적용되야함이라고 개인적으로는 이해했으나, 정확히 집고 가야하는 부분이어야 한다고 생각해서 질문드립니다.

const구분 이라 위의 부분이 작동해야하며 const라 function 안에 위치해야하는 것인지요...

아주 기본적인 부분일 수 있지만.. 워낙 백지상태로 시작하여 질의 드립니다 ㅠㅠ

인프런 커뮤니티 질문&답변