묻고 답해요
141만명의 커뮤니티!! 함께 토론해봐요.
인프런 TOP Writers
-
미해결모던 자바스크립트(ES6+) 기본
window 오브젝트에서의 함수표현식 호출
안녕하세요. const test = function () { console.log('test 입니다.') } 함수표현식으로 된 코드가 있습니다. window 오브젝트를 사용하여 접근을 하고 싶습니다. 개발자도구로 Scope에서 Script 에 적용되어 있는거 까진 확인했습니다. window 오브젝트를 통해 함수표현식 코드를 실행하려고 한 이유는 팝업창(자식창)에서 부모창에서 선언된 함수를 호출하려 합니다. ex) window.opener.test(); 만약 window 오브젝트에서 Script Scope를 접근할 수 없다면 팝업창(자식창)에서 부모창의 함수를 호출하는 방법을 알고 싶습니다.
-
미해결자바스크립트 중고급: 엔진 핵심
호이스팅 관련 정리
호이스팅 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를 반환 알맞게 정리된 건지 궁금합니다..