변수

변수란?

컴퓨터는 CPU를 통해서 연산하고 메모리를 사용해서 데이터를 기억한다.

Memory란? 데이터를 저장할 수 있는 메모리 셀의 집합체다.

-> 크기는 1byte이고 쉽게 말하자면 원룸을 생각하면된다.

1바이트 단위로 데이터를 저장하거나 읽어들인다.

 

0x000.. / 0x..f2 이런 주소를 가진 메모리가 있고 그 메모리셀안에 데이터가 저장되있는 형식이다.

위 그림은 아래 출처에서 가져온 것이다.

왼쪽에 메모리 주소가 있고 메모리에 undefined, 80 같은 data가 저장되있는것이다.

 

각 셀은 고유의 메모리 주소를 가진다. -> 주소는 메모리 공간의 위치를 나타낸다 ( Post Code로 생각하면 편함)

4GB메모리는 0x00..~0xFF.. 의 주소를 가진다 (엄청 많음)

 

그리고 컴퓨터는 우리가 사용하는 언어를 모두 2진수인 (0,1) 처리하는것을 기억하자.

 

그러면 저기 메모리셀에 있는 변수를 사용하려고하면 그냥 메모리 주소에 접근해도 되지 않을까???

-> 안된다. 메모리주소에 직접 접근하는것은 치명적인 오류를 발생시킬수도 있고 / 자바스크립트에선 직접적인 제어를

허용하지 않는다.

 

그래서 변수라는 개념이 나왔고 이 변수는 '메모리 공간 자체 or 메모리 공간을 식별하기 위한 식별자를 말한다.'

 

변수의 할당 = 저장,대입

저장된값을 읽는것을 '참조' 라고 한다.

변수의 이름을 사람이 정하기에 마음대로 할 수 있지만 다른사람이 봐도 충분히 이해할수있도록 사용하는 버릇을 들이는 것이 좋다

ex) let result=~ 이런식으로

 

또한 변수이름을 '식별자(identifier)'라고도 한다. (식별字)

 

위에서 설명했지만 식별자(변수)는 값을 기억하는 것이 아닌 값이 담겨있는 메모리 주소를 기억한다고 했다.

 

하지만 식별자는 변수에만 국한된것이 아닌 함수,클래스등 식별할수있는 것이면 모두 식별자다.

 

변수 선언

var,let,const가 있고 let과 const가 나오기 전까지는 var을 사용했었다.

단점을 설명하기 이전에 먼저 , 위 그림에서 undefined가 있는 이유를 설명하겠다.

(변수를 선언하고) -> 자바스크립트 엔진에 이런 변수가 있다고 말함

-> 자바스크립트 엔진이 확보된 메모리 공간에는 undefined를 먼저 넣어둠 (초기화)

?? 초기화를 안하면 ?? -> garbage value라는 것을 가짐(다른 값이 참조했던 메모리)

 

 

호이스팅

Hoisting 

한번 잡고 가야하는 중요한 개념이다.

 

먼저 이런 코드를 보자

console.log(hi); //undefined

var hi;

변수선언을 나중에 했는 undefined가 나오는 이유??

-> JS는 인터프리터에 의해 위에서부터 한줄씩 내려오면서 코드를 실행시키는데 '변수선언'은 어디있던지 먼저 읽어들인다. 이것을 "끌어올린다고 해서 호이스팅(Hoisting)" 이라고 하는 것이다.

 

console.log(hi);

var hi;

hi='say hi'

console.log(hi);
------------------
undefined
say hi

선언한 변수에 값을 할당할때는 undefined가 있는 메모리 주소안에 있는 값을 밀어버리고 'say hi'라는게 차지할까?

-> 답은 아니다. 새로운 메모리 공간을 확보해서 undefined가 있는곳이아닌 다른 메모리 주소에 'say hi'를 넣는다.

 

원래 값이 들어있던 메모리 주소안에 값들은 가비지 콜렉터에 의해서 제거된다.

 

	var	let	const
스코프	함수 레벨	블록 레벨	블록 레벨
재선언	가능	불가능	불가능
재할당	가능	가능	불가능

 

 

var은 치명적인 단점이 있고 그 단점은 '블록 레벨 스코프'가 아니라 '함수 레벨 스코프'를 지원한다는 것이다.

간단하게 코드로 구현해서 설명하겠다.

 

함수 레벨 스코프 : 전역 변수 , 지역변수 개념이 없어서 블록 { } 안에 선언해도 블록밖에서 사용할 수있음

if (true) {
  var x = 5;
}
console.log(x); // 5

블록 레벨 스코프 : 전역변수 , 지역변수가 확실함

if (true) {
  let y = 5;
}
console.log(y); // ReferenceError: y is not defined

 

[출처]

https://developer.mozilla.org/ko/docs/web/javascript/guide/grammar_and_types#Declarations

https://hyeok999.github.io/2019/10/09/javascript-preview-10/