[DeepDive] 변수 선언, 할당, 초기화, 호이스팅?

컴퓨터는 연산과 기억을 수행하는 부품이 나누어져있다.

 

CPU가 연산을 하고, 메모리를 사용해 데이터를 기억한다.

 

 

 

 

메모리는 데이터를 저장할 수 있는 메모리 셀의 집합, 셀 하나의 크기는 1Byte(8Bit),

각 셀은 메모리 고유의 메모리 주소를 가진다.

 

 

CPU가 연산을 한 값을 재사용하기 위해서는 메모리에 저장을 해야한다. 하지만 저장값에 직접 접근하는 것은 치명적 오류를 발생시킬 가능성이 높고 실수로 운영체제에 꼭 필요한 파일을 수정하거나 삭제하는 경우도 있기 때문에 자바스크립트는 개발자의 직접적인 메모리 제어를 허용하지 않는다. 게다가 값이 저장될 메모리 주소는 임의로 결정되기 때문에 메모리셀의 주소는 항상 변한다.

 

==> 고로, 우리는 이 값을 '변수'라는 곳에 저장을 해야한다.

 

◆ 변수?

하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말한다.

=>' 주소가 매번 바뀌니깐 주소 대신 이름을 주고 그 이름으로 부르겠다. ' 와 같다.

---

◆ 식별자?

어떤 값을 구별해서 식별할 수 있는 고유한 이름이라하고 === 변수이름,

값이 아니라 메모리 주소를 기억하고 있다.

---

◆ 변수의 선언,  할당, 초기화?

▶ 변수 선언 ? 변수를 만드는 것(생성)

 

메모리 공간을 확보하고 주소를 연결해서 값을 저장할 수 있게 준비하는 것.

변수를 사용하려면 선언이 무조건 필요하며, var let const 키워드를 사용.

변수 선언은 런타임 이전에 실행된다.

 

ES6에서 let, const가 도입되었으며, 이전까지는 var를 사용했다.

 

▶ 변수 할당? 값을 넣어주는 것(값 주기)

변수에 값을 할당할 때는 =를 사용,

할당 연산자인 = 는 우변의 값을 좌변의 변수에 할당한다.

변수 할당은 런타임에 실행된다.

 

☞중요한 점은, 변수 값 할당시에 이전 값인 변수 선언당시 저장되어있던 undefined의 메모리 공간을 지우고 그 메모리 공간에 할당값을 저장하는 것이 아니라 새로운 메모리 공간을 확보하고 그곳에 할당값을 저장한다. 값을 재할당하더라도 새로운공간에 저장을 한다.

 

 

 

 

▶ 변수 초기화? 메모리공간을 확보하고 값 세팅

 

var name;

위 코드는 변수 선언문이다. 말 그대로 변수는 name이야라고 칭하는 것.

선언만 했을 뿐 값을 할당하고 초기화하지 않았기 때문에 변수 선언에 의해 확보된 메모리 공간은 비어있을 것으로 생각할 수 있다.

지만 확보된 메모리 공간에는 자바스크립트 엔진에 의해 undefined라는 값이 암묵적으로 할당되어 초기화된다.

 

 

 

var키워드를 사용한 변수선언은 선언단계+초기화단계가 동시에 진행된다.

==> 고로, 변수만 선언하면 암묵적으로 undefined를 자동으로 할당해 초기화한다.

 

 

변수를 사용하려면 반드시 변수 선언이 필요하고, 선언하지 않은 값에 접근한다면 Reference Error가 발생한다.

---

◆ 변수 선언의 실행 시점, 호이스팅 ?

자바스크립트는 순서대로 코드를 불러온다. 하지만, 선언된 변수를 먼저 쭉 훑는다.

 

console.log(name);

var name;

예를 들면,  위와 같은 코드가 있을 경우 

콘솔에 찍히는 name은 undefined가 된다.

var 키워드로 변수를 선언했을 경우 위에 언급했다시피 자바스크립트는 선언된 변수 name을 먼저 확인한 뒤  undefined로 값을 할당하고 초기화한다. 

변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 런타임이 아니라, 이전에 일어나는 것.

 

 

==> 변수 선언문이  코드의 맨위로 올려진 것처럼 동작하는 자바스크립트의 고유 특징

이를 호이스팅이라 부른다.

 

변수 선언만 그런것이 아니라, var let const function class 키워드를 사용해서 선언하는 모든 식별자는 호이스팅 된다.

==> 모든 선언문은 호이스팅 된다.