호이스팅 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를 반환
알맞게 정리된 건지 궁금합니다..