컴포넌트 외부에 선언한 const 호이스팅

Question

추천하는 컴포넌트 파일 작성법 강의 3:00 에서  MyComponent 하단에 선언된 COLUMNS 및 URL_PRODUCT_LIST 는 어떻게  MyComponent 에서 사용할 수 있는건가요? hoisting이슈가 있을것 같아서 직접 돌려봤는데 에러없이 잘되네요..?  export default 처리되는 함수는 webpack이 코드 아래쪽으로 옮겨주는건가 싶기도하고.... 답을 알려주세요ㅠ 혼란스럽네요

이재승 · Answer

안녕하세요 죄송합니다, 답변이 좀 늦었네요; 함수 실행 시점에 변수가 초기화된 상태라면 사용할 수 있습니다 화살표 함수, 일반 함수 모두 아래쪽에서 정의된 변수를 사용할 수 있습니다 따라서 아래 코드는 잘 동작합니다 const f1 = () => console . log ( v1 ); const v1 = 123 ; f1 (); 하지만 아래 코드는 에러가 납니다 (변수가 초기화 되기 전에 접근하므로) const f1 = () => console . log ( v1 ); f1 (); const v1 = 123 ;

이경일 · Answer

함수 외부에서 선언된 전역 변수이기때문에 사용이 가능한것으로 이해하였습니다. 다만, 변수로 선언된 화살표함수 의 경우, 하단에 선언된 const 상수를 사용을 못할것으로 생각이되는데 에러는 발생하지 않네요 이에관한 원리가 궁금합니다 ㅎㅎㅎ