변수

• 컴퓨터는 메모리를 사용해 데이터를 기억한다.

=> 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체다. 메모리 셀 하나의 크기는 1바이트이다.

let a = 20;
let b = 30;
let c = a+b;

• 위와 같은 코드의 경우, 20과 30이라는 정수 값이 메모리의 한 공간을 차지하며 변수 a와 b는 그 메모리 공간의 상징적인 이름을 붙힌 것이다.. 또한 변수 c에서는 a와 b의 연산의 결과 값이 저장되어 있고, 이 때 연산의 결과가 또 다른 메모리의 공간을 차지하게 되고 변수 c는 a와 b의 + 연산 결과 값이 저장되어 있는 메모리의 이름을 붙인 것이라고 할 수 있다.

식별자

• 변수 이름을 식별자라고도 한다. 식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름을 말한다. 위 코드에서 변수 a에는 20이라는 값을 식별할 수 있었다. 이를 위해 식별자 a는 20이 저장되어 있는 메모리 공간의 주소를 알아야 한다.

이를 통해 알 수 있엇던 점 => 식별자는 값이 아니라 그 값의 메모리 주소를 기억하고 있다.

변수 선언

let afk;

• 만약 이렇게 변수에 값을 할당하지 않고 선언만 했다고 하면 과연 afk라는 변수는 메모리 공간을 차지할까?

=> 정답은 차지한다 이다.

변수에 값이 할당되지 않아도 자바스크립트는 afk라는 변수의 메모리 공간을 확보한다. 그 메모리에는 값이 정의 되지 않았다 라는 뜻의 undefined 가 할당된다.

호이스팅

console.log(afk);

var afk;

• 위 코드의 결과는 어떻게 나오게 될까?
  호이스팅을 알기 전까진 나도 "당연히 변수선언식이 변수 참조 시점보다 늦게 나왔으니 Reference error가 뜰 것이다." 라고 생각했다.

• 정답은 => undefined 로 출력된다는 것이다.

이유는 바로 변수의 호이스팅이 이루어졌기 때문이다. C언어 같은 컴파일 언어는 저런 식으로 코드를 적으면 바로 에러가 날 것이다. 그러나 자바스크립트는 한 줄 한 줄 읽어들여 실행하는 인터프리터 언어이며 그 와 동시에 가장 중요한 점은

=> 변수 선언이 소스코드가 한 줄 한 줄 실행되는 시점인 런타임 시점이 아니라 그 이전단계에서 실행되기 떄문이다.

이를 소스 평가 과정이라고 하는데 이 과정이 끝나면 변수 선언을 포함한 모든 선언문을 제외하고 소스코드를 한 줄씩 순차적으로 실행하게 된다.

• 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트의 고유의 특징. 이것을 바로 호이스팅 이라고 한다!

할당

• 변수 선언이 런타임 이전에 실행되면

var afk = 10;

위의 코드 변수 afk의 값의 할당은 언제 이루어질까?

=> 런타임 이전, 소스 평가 과정을 거치고 나서야 할당이 이루어진다.
undefined -> 10 이라는 정수 값 할당

순으로 이루어진다.

값의 재할당

• 아래 코드와 같이 변수의 값을 재할당하면 내부적으로 무슨 일이 일어날까?

var afk = 10;
afk = 20;

처음 코드를 실행시키면 afk라는 변수의 메모리 공간을 확보하고 런타임 때 먼저 정수 10이 그 메모리 공간에 할당될 것이다. 그 다음 afk = 20; 이라는 재할당 식을 읽어들인 후 새로운 메모리 공간을 확보하여 20이라는 값을 할당한다.

• 여기까지만 보면 현재 메모리에는 처음 변수 afk가 선언되었을 때의 undefined의 메모리, 10의 메모리, 20의 메모리 총 세 개의 메모리가 존재하고, 최근에 재할당은 20의 메모리 공간은 제외하고 두 개의 메모리는 사용하지 않는 상태이다.

=> 이 떄 자바스크립트 엔진은 가비지 콜렉터 라는 기능을 통해 사용하지 않는 메모리를 해제한다.

가비지 콜렉터

• 가비지 콜렉터는 메모리 공간을 주기적으로 검사하여 사용하지 않는 메모리를 해제하는 기능이다. 이로써 메모리 누수를 방지하고 단, 언제 해제될지는 예측할 수 없다.

식별자 네이밍

예약어

• 예약어는 자바스크립트에서 사용되고 있거나 사용될 예정인 언어를 말한다.
  => awain, break, case, try, catch, null, new 등등..
• 예약어는 변수로 사용될 수 없다.

네이밍 컨벤션

• 네이밍 컨벤션은 하나 이상의 영어 단어로 구성된 식별자를 만들 때 가독성 좋게 단어를 한 눈에 구분하기 위해 규정한 명명 규칙이다

카멜 케이스

let awayKeyboard;

스네이크 케이스

let away_Keyboard;

파스칼 케이스

let AwayKeyboard;

• 변수나 함수 네이밍은 카멜 케이스, 생성자 함수나 클래스 네이밍은 파스칼 케이스를 주로 사용한다고 한다...

=> 나도 상황에 맞는 네이밍 컨벤션으로 사용해서 가독성 높은 코드를 작성해야 겠다.

---

표현식

• 값으로 평가될 수 있는 문(statement) 이다. 즉, 표현식이 평가되면 새로운 값을 생성하거나 참조한다.

var a = 10;

• 이 때 a와 10의 관계를 동치 라고 한다.

표현식인 문과 표현식이 아닌 문

1. 예를 들어

var afk;

위와 같은 변수 afk는 값으로 평가될 수 없으므로 표현식이 아니다. 선언문이다.

2. 할당?

var afk;
afk=200;

afk=200; 자체가 표현식이다. 즉, 할당문은 표현식인 문이기 때문에 값처럼 사용할 수 있다.

3. 공부하면서 처음봤던 경우

var afk = x = 200;
console.log(afk); // 200

위의 경우는 할당문을 변수에 할당한 예제이다. 이 때 x=200 이라는 할당문은 할당한 값 200처럼 평가되기 때문에 afk에는 200이 할당된다.