[JavaScript] 호이스팅

자바스크립트의 호이스팅은 변수와 함수 선언이 스코프의 최상단으로 끌어올려져 선언전에 사용할 수 있게 해주는 특성입니다.

변수 호이스팅

var 선언

var로 선언된 변수는 선언부만 호이스팅되며 초기화는 원래 위치에서 이루어집니다. 초기화 이전에 변수를 참조하면 undefined가 반환됩니다.

console.log(a); // undefined
var a = 5;
console.log(a); // 5

 

let과 const선언

let과 const로 선언된 변수도 호이스팅되지만, Temporal Dead Zone때문에 초기화 이전에 접근하지못하고 ReferenceError가 발생합니다..

console.log(b); // ReferenceError: Cannot access 'b' before initialization
let b = 10;

 

함수 호이스팅

함수 선언

함수 선언문은 전체 스코프에서 호이스팅되어 선언 위치와 관계없이 호출할 수 있습니다.

console.log(myFunc()); // "Hello"
function myFunc() {
    return "Hello";
}

 

함수 표현식

함수 표현식은 호이스팅되지 않습니다. 변수의 선언만 호이스팅되므로, 초기화 이전에 호출하면 TypeError가 발생합니다.

greet(); // TypeError: greet is not a function
var greet = function() {
  console.log("Hello");
};

 

https://idocleancode.tistory.com/424

[자바스크립트] 학습 로드맵

 

관련자료

• https://developer.mozilla.org/en-US/docs/Glossary/Hoisting
• https://www.digitalocean.com/community/tutorials/understanding-hoisting-in-javascript
• https://www.youtube.com/watch?v=EvfRXyKa_GI