TIL(Today I Learned) 🧑🏻‍💻

4. 변수(2)

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

console.log(score); // undefined
var score; // 변수 선언문

ReferenceError가 발생할 것처럼 보이지만, 에러는 발생하지 않고 undefined가 출력된다

• 변수 선언(선언 단계와 초기화 단계)이 소스코드가 한 줄씩 순차적으로 실행되는 시점, 즉 런타임(runtime)이 아니라 그 이전 단계에서 먼저 실행되었다.

• 자바스크립트 엔진은 런타임(runtime) 이전에 변수 선언을 포함한 모든 선언문(변수 선언문, 함수 선언문 등)을 소스코드에서 찾아내 먼저 실행한다.
  

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

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

4.5  값의 할당

var score; // 변수 선언
score = 80; // 값의 할당

var score = 80; // 변수 선언과 값의 할당

자바스크립트 엔진은 변수 선언과 값의 할당을 하나의 문으로 단축 표현해도 변수 선언과 값의 할당을 2개의 문으로 나누어 각각 실행한다.

console.log(score); // undefined

var score; // 변수 선언
score = 80; // 값의 할당

console.log(score); // 80

변수 선언은 소스코드가 순차적으로 실행되는 시점인 런타임 이전에 먼저 실행되지만 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.

이전 값 undefined가 저장되어 있던 메모리 공간을 지우고 그 메모리 공간에 할당 값 80을 새롭게 저장하는 것이 아니라 새로운 메모리 공간을 확보하고 그곳에 할당 값 80을 저장한다는 점에 주의하자.

4.6  값의 재할당

var score = 80; // 변수 선언과 값의 할당
score = 90;     // 값의 재할당

var 키워드로 선언한 변수는 선언과 동시에 undefined로 초기화되기 때문에 엄밀히 말하자면 변수에 처음으로 값을 할당하는 것도 사실은 재할당이다.

• 값을 재할당할 수 없어서 변수에 저장된 값을 변경할 수 없다면 변수가 아니라 상수(constant)라 한다.

변수 재할당시 새로운 메모리 공간을 확보하고 그 메모리 공간에 숫자 값을 저장한다는 것에 주의하자.

• 어떤 식별자와도 연결되어 있지 않은 불필요한 값들은 가비지 콜렉터(garbage collector)에 의해 메모리에서 자동 해제된다. 단, 메모리에서 언제 해제될지는 예측할 수 없다.

4.7  식별자 네이밍 규칙

• 식별자는 다음과 같은 네이밍 규칙을 준수해야한다.

• 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어(_), 달러 기호($)를 포함할 수 있다.
  
  
• 단, 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어(_), 달러 기호($)로 시작해야 한다. 숫자로 시작하는 것은 허용되지 않는다.
  
  
• 예약어는 식별자로 사용할 수 없다.

• 하나의 문에 여러 개의 변수를 선언할 수 있지만 가독성이 나빠지므로 권장하지 않는다.

• 네이밍 컨벤션

// 카멜 케이스(camelCase)
var firstName;

// 스네이크 케이스(snake_case)
var first_name;

// 파스칼 케이스(PascalCase)
var FirstName;

• 자바스크립트에서는 일반적으로 변수나 함수의 이름에는 카멜 케이스를 사용하고, 생성자함수와 클래스의 이름에는 파스칼 케이스를 사용한다.

새로운 용어 정리

• 가비지 콜렉터(garbage collector): 애플리케이션이 할당(allocate)한 메모리 공간을 주기적으로 검사하여 더 이상 사용되지 않는(어떤 식별자도 참조하지 않는) 메모리를 해제(release)하는 기능. 자바스크립트는 가비지 콜렉터를 통해 메모리 누수(memory leak)을 방지한다.

• 메모리 누수(memory leak): 컴퓨터 프로그램이 필요하지 않은 메모리를 계속 점유하고 있는 현상. 할당된 메모리를 사용한 다음 반환하지 않는 것이 누적되면 메모리가 낭비된다.

• 언매니지드 언어(unmanaged language): 메모리 제어 기능을 제공하는 언어 (ex: c, c++ ...), 성능 확보가 가능하지만 반대의 경우 치명적 오류를 생산할 가능성이 있다.

• 매니지드 언어(managed language): 메모리 관리 기능을 언어에서 담당하여 직접적인 메모리 제어가 허용되지 않는 언어 (ex: javascript...), 일정한 생산성을 확보할 수 있지만 성능 면에서 어느 정도의 손실을 감수해야한다.

참고 문헌

* 모던 자바스크립트 Deep Dive ( 자바스크립트의 기본 개념과 동작 원리 ) / 이웅모 지음