[JS] 변수 및 상수에 관한 호이스팅이란 ?

삽질 로그의 삶·2022년 10월 22일
0

자바스크립트

목록 보기
1/3

호이스팅

서론

자바스크립트에 대해 아마 가장 자주 쓰는 코드를 물어본다면,

단언코 var , let, const 일것이다.

컴퓨터를 예로 들면, 컴퓨터를 부팅하고 실행하기 위해 각종 메인부품 외 부속 부품들을 조합하고 연결하여

실행하여야 한다.

그런데 이와 같은 과정을 하기 위해선 쉽지 않다.

각 부품별 최적의 회로와 사이즈, 전력량 등을 효율적으로 짜임새 있게 구성하여야 컴퓨터를 효과적으로

사용하고 오래 사용할 수 있는 컴퓨터를 구성할 수 있기 때문이다.

프로그래밍도 이와 마찬가지로 여러 변수 및 상수들을 효율적으로 구성하여야 프로그램을 실행하는 데 있어

방해가 되는 버그 사항을 사전에 식별할 수 있어야 하고, 가급적 자주 사용하는 부품들을

공유하여 같이 사용할 수 있게끔 효율적으로 짜는 행위가 필요하다.

서론이 길었으나, 반드시 기억하고 있어야 하는 내용이라고 생각하고 비단 자바스크립트 뿐만 아니라

다른 모든 프로그래밍 언어에도 공통적으로 적용되는 사항이라고 생각한다.

선언

var name;
console.log('결과 : ', name);

위와 같은 코드는 선언을 하는 코드이며, 프로그램 작성자가 초기화를 하지 않았기에
name이라는 용어가 어떤 행위를 하거나 어떤 역할을 하는지
컴퓨터에서는 알 수가 없으므로 프로그램에서 에러로 식별될 수있다.
그러나 그것을 자바스크립트에서 사전에 잡아주는 행위를 하는데,
var 의 경우에는 초기화를 하지 않았을 경우 undefined로 할당된다.

자 그럼, 호이스팅을 왜 하는지 궁금할 것이다. 그냥 실행해도 되지 않나? 라고 생각할 수 있지만

자바스크립트는 컴파일러가 아닌 인터프리터로 실행한다.

컴파일러의 역할

원시코드를 기계어로 번역하여 실행 프로그램으로 만든다.

인터프리터의 역할

프로그램의 소스코드를 직접 실행하는 프로그램 및 환경이다.

쉽게 설명하자면, 컴파일러의 경우 소스코드를 전부 다 읽은 다음에 번역하여 실행 프로그램으로 만든다.

즉, 한국말처럼 모든 내용을 끝까지 다 듣고 판단한다는 것이다.

그러나 인터프리터의 경우 소스코드를 한 줄 단위로 읽고 실행한다.

한 줄 단위로 실행하는 기준에 있어 첫 줄부터 순차적으로 읽고 실행하는데,

사전에 선언하지 않았을 경우 그 다음 실행코드에서 인지하지 못하고 에러를 발생할 수도

있는 것이다. 결국 그것을 방지하기 위해서 호이스팅 처리를 하는 것이다.

따라서 아래와 같은 코드도 에러가 발생하지 않는 것이다.

변수 예제

console.log(dog);  // 호이스팅한 var 선언으로 인해 undefined 출력
var dog;  // 선언
dog = '멍멍이';  .. 초기화

함수 예제

dogName("똘똘이");
function dogName(name){
	console.log("제 강아지 이름은 " + name + "입니다"); // 제 강아지 이름은 멍멍이입니다
}

const 와 let 의 경우, 호이스팅 대상이지만 var와는 다르게
undefined로 초기화하지는 않아서, 코드 실행 시 에러가 발생한다.

정리하자면, 호이스팅은

인터프리터에 의해 자바스크립트 코드가 실행할 때 나중에 선언된 변수나 함수에 대해

호이스팅 처리를 하여 에러를 방지하기 위해 하는 행위라고 볼 수 있겠다.

참고자료

https://developer.mozilla.org/ko/docs/Glossary/Hoisting

https://ko.wikipedia.org/wiki/%EC%9D%B8%ED%84%B0%ED%94%84%EB%A6%AC%ED%84%B0

profile
맨땅에 헤딩하는 개발자입니다

0개의 댓글