실행 컨텍스트 - Record와 호이스팅

소밍·2023년 1월 19일
0
post-thumbnail

실행컨텍스트는 자바스크립트 스펙을 위한 매커니즘으로 record(이하 *환경 레코드)와 outer를 가지고 있다. (환경 레코드 : 식별자와 식별자에 바인딩된 값을 기록해두는 객체)

호이스팅이란 변수 선언 라인 이전에도 에러 없이 변수를 참조할 수 있는 현상으로 자바스크립트 엔진이 전체 코드를 스캔하여 변수와 같은 정보를 실행 컨텍스트의 환경 레코드에 미리 기록하기 때문에 선언문이 마치 최상단에 끌여 올려진듯한 현상이 발생한다.

1. 생성 단계

실행컨텍스트를 생성하고 선언문만 먼저 실행하여 환경 레코드에 미리 기록.

2. 실행 단계

선언문 외 나머지 코드를 순차적으로 실행하며 필요한 경우 환경 레코드 정보를 참고하거나 업데이트 함.


변수 호이스팅

선언단계 ; 메모리 공간을 확보해두고 메모리 주소에 식별자를 연결해둠
초기화단계 ; 식별자를 암묵적으로 undefined 값으로 초기화하여 바인딩

* var 키워드로 선언한 경우 ; 선언과 초기화 동시에 진행

var 키워드로 선언했기 때문에 undefined로 값을 초기화하여 기록
{ TVChannel : undefined }
1 ) 환경레코드를 참조하여 undefined 출력
2 ) TVChannel에 바인딩된 값을 Netflix로 업데이트하여 기록
3 ) 환경레코드를 참조하여 Netflix 출력

console.log(TVChannel); // undefined
var TVChannel = "Netflix";
console.log(TVChannel); // Netflix

* let, const 키워드로 선언한 경우 ; 선언 라인 이전에는 변수를 참조할 수 없다

var키워드 선언과 달리 값을 초기화하지 않고 식별자를 기록 { TVChannel }
1 ) 선언문 이전에 TVChannel 참조할 경우 Reference Error 발생
2 ) TVChannel에 바인딩된 값을 Netflix로 기록
3 ) 환경레코드를 참조하여 Netflix 출력

console.log(TVChannel); //Reference Error
const TVChannel = "Netflix";
console.log(TVChannel); // Netflix

let이나 const로 선언한 경우 선언 라인 이전에 식별자를 참조할 수 없는데 이 구역을 일시적 사각지대라고 부름
값을 let const로 선언하면 값을 초기화하지 않음, 때문에 선언라인 이전까지는 변수에 아무런 값이 담기지 않아 값을 참조할 수 없어 일시적 사각지대가 생김

함수 호이스팅

함수 표현식

변수에 함수를 담아 함수를 선언하는 방식,
함수를 변수에 담고 있기 때문에 변수 호이스팅과 동일하게 동작

- var 키워드로 선언한 경우

var 키워드로 선언했기 때문에 undefined로 값을 초기화하여 기록
{ study : undefined }
1 ) undefined 데이터 타입은 함수와 달리 호출될 수 없기 때문에 Type Error 발생

study(); // Type Error
var study = () => {
	//do study
}

- let, const 키워드로 선언한 경우

var키워드 선언과 달리 값을 초기화하지 않고 식별자를 기록 { study }
1 ) 선언문 이전에 study 참조할 경우 Reference Error 발생

study(); // Reference Error
const study = () => {
  	//do study
}

함수 선언문

선언과 동시에 함수가 생성되어 선언 라인 이전에도 함수를 사용할 수 있음.
자바스크립트 엔진이 study 함수의 선언과 동시에 완성된 함수 객체를 생성하여 환경레코드에 기록 { study : f{} }
1 ) study함수 실행하면 에러 없이 do study 실행

study(); // Type Error
function study(){
  	//do study
}
profile
생각이 길면 용기는 사라진다.

0개의 댓글