컴퓨터는 모든 데이터를 0과 1로 바꿔서 기억한다. 0 또는 1 하나의 값을 표현할 수 있는 하나의 메모리 조각을 비트(bit)라고 한다. 하지만 비트 단위로만 0과 1 밖에 표현하지 못하므로 매우 비효율적이기 때문에 이를 여러개씩 묶어 표현할 수 있는 바이트(byte)라는 단위가 생기게 되었다. 바이트는 8개의 비트로 총 2⁸(=256) 가지의 값을 표현할 수 있다.

컴퓨터는 데이터를 메모리(memory)를 사용해 기억하는데, 메모리는 데이터를 저장할 수 있는 메모리 셀(memory cell)의 집합체이고, 메모리 셀 하나의 크기는 1바이트(8비트)이다. 컴퓨터는 메모리 셀의 크기(1 바이트) 단위로 데이터를 저장하고 읽어들인다.

각 메모리 셀은 고유한 메모리 주솟값을 갖고 이 메모리 주소는 메모리 공간의 위치를 나타낸다. 하지만 메모리 주소를 통해 값에 직접 접근하는 것은 매우 위험한 일이므로 코드가 실행되기 전까지는 값이 어디에 저장될지 알 수 없다. 이 때문에 프로그래밍 언어에서는 기억하고 싶은 값을 메모리에 저장하고, 저장된 값을 읽어 사용하기 위해 변수라는 것을 사용한다.
⭐ 변수와 식별자
변경 가능한 데이터가 담길 수 있는 공간을 변수라고 하고, 이 변수를 식별할 수 있는 고유한 이름을 식별자(변수 이름), 변수에 저장된 변할 수 있는 값을 변수 값이라고 한다.
변수를 만들고 이 변수의 식별자를 지정하는 것을 선언, 변수에 값을 저장하는 것을 할당, 변수에 저장된 변수 값을 읽어 들이는 것을 참조라 한다.
🧷 선언
- 값을 저장하기 위한 메모리 공간을 확보
- 식별자와 확보된 메모리 공간의 주소를 연결
식별자는 변수를 식별하는 데 사용하는 고유한 이름을 말한다. 이를 위해 식별자는 메모리 주소를 기억하며 값이 저장되어 있는 메모리 주소와 매핑 관계를 맺는다. (이 매핑 정보도 따로 메모리에 저장해야 식별자가 기억하는 메모리 주소로 데이터에 접근할 수 있다.)
자바스크립트에서 변수를 선언하려면 var, let, const 키워드를 사용해야 한다. 자바스크립트 엔진은 이 키워드를 만나면 뒤에 오는 식별자로 새로운 변수를 선언한다.
💥호이스팅💥
console.log(b); // undefined
var b;
b = 10;
자바스크립트 엔진에서 소스코드를 한 줄씩 순차적으로 실행한다면 변수를 선언하기 전에 사용한다면 에러가 나지 않을까? 하지만 에러가 나지 않고 변수가 정의되지 않았다는 undefined가 출력된다. 그 이유는 자바스크립트 엔진은 소스코드를 실행하기 앞서 평가 과정을 거치면서 변수 선언을 퐇마한 모든 선언문을 소스코드에서 찾아내 먼저 실행한다. 즉, 변수 선언은 소스코드가 한 줄씩 순차적으로 실행되는 '런타임' 시점이 아니라 그 이전 평가 과정에서 먼저 실행되게 되므로 변수를 선언하기 전에 사용해도 참조 에러가 발생하지 않는 것이다. 이처럼 선언문들이 코드의 맨 위로 끌어올려져 동작하는 것을 자바스크립트의 호이스팅(hoisting)이라고 한다. (hoist라는 단어가 감아올리다 라는 뜻이다.)
🧷 할당
- 데이터를 저장하기 위한 별도의 메모리 공간을 확보해 데이터를 저장
- 데이터를 저장한 주소를 변수 영역에 저장
변수 영역에 값을 직접 대입하지 않고 별도의 메모리 공간을 확보해 데이터를 저장하는 이유는 디에터 변환과 메모리를 더욱 효율적으로 관리하기 위해서이다.
var animal;
animal = 'dog';
animal = 5;
animal 이라는 변수에 'dog' 라는 값을 할당한 후 5를 재할당하는 과정을 메모리 영역에서 보면
주소 | 0x00000000 | 0x00000001 | 0x00000002 | ... | |
데이터 | 이름 : animal 값 : 0x000FB154 |
||||
주소 | ... | 0x000FB153 | 0x000FB154 | 0x000FB155 | ... |
데이터 | undefined | 'dog' | 5 |
일단 animal 이라는 변수를 선언하면 임의의 데이터 영역(위 표에서는 0x00000001)에 식별자와 undefined 값이 저장된 주소가 매핑된 정보가 저장된다. 'dog'라는 값을 animal 변수에 할당하면 새 주소에 데이터 'dog'를 저장하고 그 주소를 0x00000001 에 다시 매핑한다. 그리고 숫자 5를 다시 재할당하면 이전 값이 저장되어 있던 메모리 공간을 지우고 새로 저장하는 것이 아니라 다시 새로운 메모리 공간을 확보하고 그 메모리 공간에 숫자 5를 저장하고 다시 매핑한다.
'자바스크립트' 카테고리의 다른 글
자바스크립트의 this (0) | 2022.02.27 |
---|---|
var, let, const 비교 (0) | 2022.02.24 |
자바스크립트 연산자 (0) | 2022.02.20 |
자바스크립트 데이터 타입 (0) | 2022.02.18 |
자바스크립트의 역사 (0) | 2022.02.15 |