호이스팅(Hoisting)의 개념
함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것
호이스팅이란
- 함수 안에 존재하는 변수/함수선언에 대한 정보를 기억하고 있다가 실행시킴
- 유효범위 : 함수 블럭{} 안에서 유효
- 즉, 함수 내에서 아래쪽에 존재하는 내용 중 필요한 값들을 끌어올리는 것
호이스팅의 대상
- var 변수 선언과 함수선언문에서만 호이스팅이 일어난다
- var 변수/함수의 선언만 위로 끌어 올려지며, 할당은 끌어 올려지지 않는다
- let / const 변수 선언과 함수표현식에서는 호이스팅이 발생하지 않는다
함수선언문과 함수표현식에서의 호이스팅
함수선언문에서의 호이스팅
- 함수선언문은 코드를 구현한 위치와 관계없이 자바스크립트의 특징인 호이스팅에 따라 브라우저가 자바스크립트를 해석할 때 맨 위로 끌어 올려진다.
함수표현식에서의 호이스팅
- 함수표현식은 함수선언문과 달리 선언과 호출 순서에 따라서 정상적으로 함수가 실행되지 않을 수 있다.
함수표현식에서는 선언과 할당의 분리가 발생한다.
호이스팅 사용 시 주의사항
- 코드의 가독성과 유지보수를 위해 호이스팅이 일어나지 않도록 한다.
- 호이스팅을 제대로 모르더라도 함수와 변수를 가급적 코드 상단부에서 선언하면, 호이스팅으로 인한 스코프 꼬임 현상은 방지할 수 있다 (let / const를 사용한다)