JS는 호이스팅 이라는 개념이 존재한다.
우선적으로 변수를 선언하면 JS는 선언된 모든 변수들은 가장 최상위 스코프로 끌려올려지듯이 행동되는 현상이다.
var의 경우에는 기본적으로 변수가 선언 되었을 때 변수에는 자동으로 값이 undefined로 초기화 되어진다.
console.log(hoisitng);
var hoisting = "min";
//undefined이런경우에 어떤 상황이 일어날까?
당연히 var 같은 경우에 호이스팅이 일어나서 기본적으로 undefined 로 값이 적용되어 있는 상태이기 때문에당연히 값이 그 후에 할당되기 전에는 기본적으로 undefined가 될것이다..호이스팅으로 생각해 보자면
var hoisting = undefined;
hoisting = "min"
console.log(hoisting);
//"min"이런 형식으로 될것이다.
[그렇다면 let 과 const는 호이스팅이 안되는가?]
사실상 호이스팅이 되고 있는 것이다.
let과 const도 실질적으로는 호이스팅이 되고 있지만 let 과 const 는 호이스팅이 되는 과정에서 값을 기본적으로 var와 달리 undefined를 넣어 주지 않기 때문에 값은 선언 되어 있지 않은 상태이다.
console.log(a)
let a = 1
//Uncaught ReferenceError: a is not defined위 코드처럼 당연히 let과 const는 애초에 값도 없는 상태 이기 때문에 정의 되어 있지 않다는 에러가 발생한다. const나 let은 호이스팅이 되면서 TDZ(Templete Dead Zone) 이라는 영역에 위치 되어 있기 때문에 애초에 값을 선언 해주지 않는다면 정상적으로 값이 출력이 되지 않는다.
[함수 또한 호이스팅 대상자?]
당연하다. 함수도 또한 호이스팅이 가능하다.
JS는 모든 선언 및 실행 되는 것들은 전부 호이스팅이 된다고 생각하면 편하다.
hi();
function hi(){
var hi = "hi"
console.log(hi);
}위의 코드를 보면 정상적으로 hi 함수가 실행 되는 것을 볼 수 있다.
함수가 정의 되어 있지 않았는데도 정상적으로 실행이 된다? 이거 상식적으로 말이 안된다..
그래서 보통 화살표 함수를 사용한다. 화살표 함수는 const 함수명 =()=>{} 이런식으로 사용한다. 즉 앞에 const를 붙이기 때문에 우선적으로 먼저 선언 되어 있지 않다면 당연히 함수는 실행이 되지 않기 때문에 사용하는 것을 권장한다.
