묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결실전 리액트 프로그래밍
컴포넌트 외부에 선언한 const 호이스팅
추천하는 컴포넌트 파일 작성법 강의 3:00 에서 MyComponent 하단에 선언된 COLUMNS 및 URL_PRODUCT_LIST는 어떻게 MyComponent에서 사용할 수 있는건가요? hoisting이슈가 있을것 같아서 직접 돌려봤는데 에러없이 잘되네요..? export default 처리되는 함수는 webpack이 코드 아래쪽으로 옮겨주는건가 싶기도하고.... 답을 알려주세요ㅠ 혼란스럽네요
-
미해결자바스크립트 중고급: 엔진 핵심
호이스팅 관련 정리
호이스팅 KeyWord 호이스팅 : 함수 앞에서 함수를 호출 본인 생각 ) 함수 선언문 자체가 해당 스코프의 최상위로 먼저 해석되고 올려지는 현상 함수 선언문 : function 함수명() { 구현 로직 }; 호이스팅에 영향, 초기화 단계에서 function object 할당 함수표현식 : var 함수명 = function () { 구현 로직 }; 호이스팅에 영향 X 예제풀이 1 번 예제 function book() { function getBook(){ return "책1"; }; //여기서 함수 호출 console.log(getBook()); function getBook(){ return "책2" }; }; book(); 함수 선언문 , 함수 호출, 함수 선언문 1. book 함수 호출 2. book 함수 안으로 엔진컨트롤 이동 // 함수 선언문 해석 3. 전체 코드에서 함수 선언문 검색 4. 첫 번째 function 오브젝트 생성(getbook) - scope 등록 5. 두 번째 function 오브젝트 생성(getbook) - scope 등록, value 대체, 호출 가능 6. 엔진 컨트롤 처음으로 이동 // 변수 초기화(추출) - 식별자 해결 7. var 변수 초기화(undefined) - 대상 없음 8. 엔진 컨트롤 처음으로 이동 // 코드 실행 - debugger, console 등 실행코드 동작 9. 해석된 선언문은 건너 뜀 10. console.log로 getBook 호출 11. value로 scope에 등록된 두 번째 getBook에서 선언문 해석, 변수 초기화, 코드실행 과정 수행 12. 책2 반환 13. 콘솔창 출력 14. book 함수 내 반환값이 없기에, void 함수로 처리되어 undefined를 반환 2번 예제 function book(){ debugger var getBook = function(){ return "책1"; }; console.log(getBook()); debugger getBook = function(){ return "책2"; }; debugger }; book(); 함수 표현식, 함수 호출, 함수 표현식 1. book 함수 호출 2. book 함수 안으로 엔진컨트롤 이동 // 함수 선언문 해석 3. 전체 코드에서 함수 선언문 검색 - 대상없음 4. 엔진 컨트롤 처음으로 이동 // 변수 초기화(추출) - 식별자 해결 5. getBook에 undefined 할당 초기화 6. scope에 등록 7. 엔진 컨트롤 처음으로 이동 // 코드 실행 - debugger, console 등 실행코드 동작 8. getBook에 function(){ return "책1"; } 할당 9. scope 등록 10. console.log로 getBook 호출 11. 변수로 지정된 첫 번째 getBook에서 표현식 실행 12. 책1 반환 13. 콘솔창 출력 14. 다음 함수 표현식을 엔진이 해석하지만, 실행코드에 의미가 없기에 순차적인 진행 종료 15. book 함수 내 반환값이 없기에, void 함수로 처리되어 undefined를 반환 3번 예제 function book(){ debugger function getBook(){ return "책1"; }; console.log(getBook()); debugger var getBook = function(){ return "책2"; }; debugger }; book(); 함수 선언문, 함수 호출, 함수 표현식 1. book 함수 호출 2. book 함수 안으로 엔진컨트롤 이동 // 함수 선언문 해석 3. 전체 코드에서 함수 선언문 검색 4. 첫 번째 function 오브젝트 생성(getbook) - scope 등록 5. 엔진 컨트롤 처음으로 이동 // 변수 초기화(추출) - 식별자 해결 6. 변수 getBook에 undefined 할당 초기화 7. scope에 등록 8. 엔진 컨트롤 처음으로 이동 // 코드 실행 - debugger, console 등 실행코드 동작 9. 해석된 선언문은 건너 뜀 10. console.log로 getBook 호출 11. value로 scope에 등록된 getBook에서 선언문 해석, 변수 초기화, 코드실행 과정 수행 12. 책1 반환 13. 콘솔창 출력 14. 다음 함수 표현식을 엔진이 해석하지만, 실행코드에 의미가 없기에 순차적인 진행 종료 15. book 함수 내 반환값이 없기에, void 함수로 처리되어 undefined를 반환 4번 예제 function book(){ debugger var getBook = function(){ return "책1"; }; console.log(getBook()); debugger function getBook(){ return "책2"; }; debugger }; book(); 함수 표현식, 함수 호출, 함수 선언문 1. book 함수 호출 2. book 함수 안으로 엔진컨트롤 이동 // 함수 선언문 해석 3. 전체 코드에서 함수 선언문 검색 4. function 오브젝트 생성(getbook) - scope 등록 5. 엔진 컨트롤 처음으로 이동 // 변수 초기화(추출) - 식별자 해결 6. 변수 getBook에 undefined 할당 초기화 7. scope에 등록 8. 엔진 컨트롤 처음으로 이동 // 코드 실행 - debugger, console 등 실행코드 동작 9. getBook에 function(){ return "책1"; } 할당 10. scope 등록 11. console.log로 getBook 호출 12. 변수로 지정된 getBook에서 표현식 실행 13. 책1 반환 14. 콘솔창 출력 15. book 함수 내 반환값이 없기에, void 함수로 처리되어 undefined를 반환 알맞게 정리된 건지 궁금합니다..