Hoisting

sang hyeok Lee·2022년 4월 3일
0

Hoisting

호이스팅은 변수나 함수의 호출 코드가 선언 코드보다 아래쪽에 있음에도 불구하고 에러가 발생하지 않고, 마치 선언 코드가 호출 코드보다 더 위에 선언된 것과 같이 동작하는 특성을 호이스팅(Hoisting) 이라고 한다.

호이스팅은 let이나 const에서는 일어날 수 없고 오직 var와 함수에서만 일어난다.

JS 엔진은 스크립트를 가져 오면 가장 먼저 코드에서 데이터를 위한 메모리를 설정한다. 이 시점에는 코드가 실행되지는 않고 실행을 하기 위한 준비단계이다.

name("철수")

function name (aaa) {
	console.log("제 이름은" + aaa + "입니다")
}

//제 이름은 철수 입니다

위 예제를 보면 함수의 호출이 함수의 선언 보다 위에 있는 데도 호출이 문제없이 일어나고 있다. 이러한 현상이 일어나는 이유는 자바스크립트엔진이 코드를 실행하기 전에 코드를 스캔하면 실행컨텍스트 어딘가에 저장을 해두기 때문이다.


변수 호이스팅

console.log(TVChannel)

var TVChannel = "Nexflix"

console.log(TVChannel)

자바스크립트 코드가 코드를 스캔하면서 선언할 것이 있는지 찾아보고 그리고 샐행콘텍스트에 저장을 해둔다. 그리고 var 코드로 선언을 주었기 때문에 undefind로 선언을 해준다. 이렇게 실행에 앞서서 스캰하고 준비하는 단계를 생성단계라고 한다. 그래서 실행을 하게 되면 var TVChannel을 지날 때 할당만을 해주고 선언이 잘 되어긴다.

let과 const 같은 문법은 식별자를 기록해주긴 하지만 undefind라는 초기값을 선언해 주지 않아서 호이스팅이 일어나지는 않는다.


함수 호이스팅

study()

var study = () => {
	//do study
}

stydt라는 함수표현 전에 함수를 실행하려고 하면 환경레코드에 선언된 study의 값은 undefined이고 undefined는 함수와 달리 호출이 될 수 없기 때문에 타입에러가 발생한다.

study()

function study () {
	//do study
}

자바스크립트 엔진이 study 함수의 선언과 동시에 완성된 함수 객체를 생성을 해서 환경레코드에 기록해 둔다. 그리고 study함수를 실행을 하면 함수가 에러없이 실행이 된다. 함수 선언문으로 작성한 함수는 선언과 동시에 함수가 생성이 된다는 것이 큰 특징이다.

profile
개발자 되기

0개의 댓글