[4장] 변수

모던 자바스크립트 Deep Dive 스터디 관련 글이다. 방학 때 임시글로만 작성해놨었는데, 한 번 더 공부하면서 이제는 출간해보려고 한다!

4.1 변수란 무엇인가? 왜 필요한가?

1. 변수(variable): 하나의 값을 저장하기 위해 확보한 메모리 공간 자체, 또는 그 메모리 공간을 식별하기 위해 붙인 이름
   
   

4.2 식별자

1. 식별자(identifier): 어떤 값을 구별해서 식별할 수 있는 고유한 이름을 말한다. 변수, 함수, 클래스 등의 이름은 모두 식별자이다.
   
   

4.3 변수 선언

1. 변수 선언: var, let, const 등의 키워드를 사용해 변수를 생성하는 것
   * ES6에서 var 키워드를 사용할 수는 있지만, 권장하지는 않는다.

2. var 키워드를 사용하면, 의도치 않게 전역 변수가 선언된다.
   * 이는 var 키워드가 function-level-scope를 지원하기 때문인데, 이는 추후 chapter15에서 더 자세히 설명하겠다.

3. JavaScript 엔진은 변수 선언을 선언과 초기화 단계로 나누어 수행한다.
   선언: 변수 이름을 등록해 변수의 존재를 알림
   초기화: 값을 저장하기 위한 메모리 공간을 확보+암묵적으로 undefined를 할당

4. undefined는 JavaScript에서 제공하는 primitive value이다. 변수 선언에 의해 확보된 메모리 공간에는 암묵적으로 undefined가 할당되어 초기화된다.
   * 변수의 할당 없이 var score;라는 문장만 작성하였다면, score의 값은 undefined이다.

5. var 키워드를 사용하면 선언 단계와 초기화 단계가 동시에 진행된다.
   * 만약 초기화 단계를 거치지 않으면, 확보된 메모리 공간에 다른 애플리케이션이 사용했던 값이 남아있을 수 있다.

6. 변수 선언을 하지 않으면, ReferenceError가 발생한다. ReferenceError는 선언하지 않은 식별자에 접근했을 때 발생한다.
   
   

4.4 변수 선언의 실행 시점과 변수 호이스팅

이번에 살펴볼 코드는 다음과 같다. 우선 결과부터 말하자면, 다음 코드의 출력 결과는 undefined이다.

console.log(value);
var value;

value를 선언하지 않고 출력을 해 ReferenceError가 발생할 것 같지만, ReferenceError는 발생하지 않았다. 이는 변수 선언이 runtime이 아닌, 그 이전 단계에서 먼저 실행되기 때문이다.

1. JavaScript 코드는 interpreter에 의해 한 줄씩 순차적으로 실행된다.

2. 한 줄씩 순차적으로 실행됨에도 불구하고 ReferenceError가 발생하지 않은 이유는, variable hoisting이라는 자바스크립트 고유의 특성 때문이다.
   * variable hoisting: 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 것

3. JavaScript 엔진은 변수 선언의 위치에 상관없이 어디에서든 변수를 참조할 수 있다.

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

4.5 값의 할당

이번에 볼 코드는 다음과 같다.

console.log(value); // 콘솔 출력: 2번째로 실행
var value = 100; // 변수 선언: 1번째로 실행
		 // 값의 할당: 3번째로 실행
console.log(value); // 콘솔 출력: 4번째로 실행

1. 변수 선언은 runtime 이전에, 값의 할당은 runtime에 실행된다.

2. 변수에 값을 할당할 때에는, 이전 값인 undefined가 저장되어 있던 메모리 공간이 아닌 새로운 메모리 공간을 확보하여 그곳에 할당 값을 저장한다.

3. 위 코드에서 run time 이전에는 변수 선언이 실행되고, run time에는 코드가 한 줄씩 순차적으로 실행된다. 따라서 결과로는 undefined가 100이 차례대로 출력된다.
   
   

4.6 값의 재할당

1. 값을 재할당할 수 없다면, 변수가 아닌 상수(constant)이다.

2. const 키워드를 사용하면 재할당이 금지된다.

3. 사용하지 않는 값들은 garbage collector에 의해 메모리에서 자동 해제된다. 단, 언제 해제될지는 예측할 수 없다.
   * garbage collector: 애플리케이션이 할당한 메모리 공간을 주기적으로 검사하여 더 이상 사용되지 않는 메모리를 해제하는 기능이다. memory leak를 방지할 수 있다.

4. JavaScript는 managed language이다. 메모리의 할당 및 해제를 위한 메모리 관리 기능을 언어 차원에서 담당하기 때문에, 개발자는 명시적으로 메모리를 할당하고 해제할 수 없다.
   * unmanaged language: C언어가 여기에 속한다. 개발자가 malloc(), free()와 같은 함수를 통해 명시적으로 메모리를 할당하고 해제할 수 있다.
   
   
   

4.7 식별자 네이밍 규칙

식별자는 네이밍 규칙을 반드시 준수해야 한다.

1. 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어, 달러 기호를 포함할 수 있다.

2. 식별자는 특수문자를 제외한 문자, 언더스코어, 달러 기호로 시작해야 한다. 숫자로는 시작할 수 없다.

3. 예약어는 식별자로 사용할 수 없다.
   * 예약어: 프로그래밍 언어에서 이미 사용되고 있거나 사용될 예정인 단어. 예를 들어, class나 continue, import, typeof 등은 모두 예약어이다.
   
   

식별자를 만들 때에, 단어의 가독성을 위해 규정한 규칙이 있다. 이를 naming convention이라고 부른다.

1. camelCase
2. snake_case
3. PascalCase
4. typeHungarianCase

주로 위 4가지 유형의 naming convention이 사용된다.