그래서 호이스팅의 장점이 뭔데

제가 코어자바스크립트의 2장 실행컨텍스트를 읽고 한 생각입니다.

발표 자료는 노션을 참고해주세요
애초에 질문 부터가 틀렸다. 호이스팅은 JS 동작 그 자체이다. 위의 질문보다는 호이스팅때문에 발생하는 에러를 피하기 위해 알아둬야하 한다! 라고 생각하면 될 것 같다.

결론부터 말하자면 호이스팅은 장점이 딱히 없는 것 같다. 이는 인터프리터 언어로 JS를 설계할 때 도입되었던 개념이고 var 선언에만 적용이 된다. 그리고 이러한 호이스팅 개념을 적용한 다른 메이저한 언어는 없다고 한다.

현재 JS는 많은 엔진 위에서 작동하는데, (그 중 가장 메이저한것은 구글의 V8이 아닐까 싶다. Node의 런타임으로도 채택되어 사용되기 때문에) 이 때문에 JS는 컴파일언어이냐 인터프리터 언어이냐의 경계가 많이 사라졌다. 하지만 이 호이스팅이라는 개념은 JS의 기본적인 동작 방식을 추상화한 것이기 때문에 사라지지 않고 남아있지 않나싶다.

호이스팅은 JS가 인기를 얻게된 ES6이전의 문법이지만 JS의 인터프리터 과정을 이해하는데 도움이 되고 이와 같은 과정을 모르면 개발자들이 높은 확률로 호이스팅과 관련된 실수를 할 수 있기 때문에 소개 된다는 생각이 든다. 만약 이러한 개념을 모르고 var를 남발하고 console.log()를 통해 값을 확인한다면 원인을 알 수 없는 undefined과 원하지 않는 변수가 저장된 상황을 자주 만나게 될 것이다.

JS사용자들에게 var보다는 let과 const를 권장하는 이유 중 하나가 호이스팅이라고 생각한다. 호이스팅은 개발자 입장에서 코드를 보는데 불편하게 만들고 로직의 흐름을 방해한다. 그렇기에 funtion scope인 let과 const를 사용하여 개발자 입장에서도 보기 좋은 로직의 코드를 만들 수 있다. 그 외에도 해당 scope을 사용해야는 이유는 더 있지만 여기서 정리하기에는 너무 잡다한 글이 될 것 같다.

아직까지는 브라우저에서 ESMA6 문법을 지원하고 있지 않기 때문에 바벨에 의해 ESMA5로 변경되게 되는데, 이때 const/let이 var로 바뀌게 되므로 개발 시에 호이스팅에 의해 꼬이지 않게끔 개발을 해놔야 나중에 문제가 없음!

좀 더 나아가...

const, let도 호이스팅이 발생한다. var로 선언했을 때 호이스팅때문에 발생한 에러는 undefined가 발생하지만 let, const로 선언했을 때 에러는ReferenceError 발생한다. 이는 var와 let의 선언 차이점때문에 발생하는 에러이다. 호이스팅 뿐만 아니라 여러가지 이유로 let,const 사용을 권장한다.

Reference

Why does JavaScript hoist variables?

Advance JavaScript: Why hoisting?

ES6, Hoisting으로 다시 보는 let, const