JavaScript_4변수

JavaScirpt 공부 정리
<모던 자바스크립트 Deep Dive>의 목차를 따릅니다. 책을 발제하는 것을 기본 골조로 하고, 개인이 공부한 내용을 추가합니다.

---

항상 변수 선언만을 배우다가, 변수가 어떻게 저장되는지를 드디어 배웠다.

---

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

1 + 2
이 자바스크립트 코드를 실행하면 컴퓨터는 어떻게 작동할까?

• cpu를 사용해 연산하고
• 메모리를 사용해 데이터를 기억한다: 1, 2, 결과값 3이 각각 하나의 메모리 주소가 있는 메모리에 저장된다.

여기서 문제가 발생한다. 각 값들을 어떻게 재사용하는가?
=> 메모리 주소를 통해 직접 값에 접근하는 것은 치명적인 오류를 발생시킬 위험성이 있기에, JS는 개발자의 직접적인 메모리 제어를 허용하지 않는다. 여기서 변수가 사용된다.

var result = 1 + 2;

변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 메모리 공간을 식별하기 위해 붙인 상징직인 이름을 말한다.

2. identifier 식별자

• 변수 이름뿐만 아니라, 함수, 클래스 드의 이름은 모두 식별자이다.
• 어떤 값을 구별해서 식별할 수 있는 고유한 이름으로, 값이 아니라 메모리 주소를 기억하고 있다.

3. 변수 선언 declaration

식별자가 존재한다는 것을 자바스크립트 엔진에 어떻게 알릴까? 바로 선언이다. 변수 선언은 변수를 생성하는 것을 말한다.

3-1) 변수 선언의 단계

이는 동시에 이루어지는 두 단계로 구성된다.

• 선언 단계: 변수 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알린다.
• 초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화한다. (만약 초기화 단계를 거치지 않으면 확보된 메모리 공간에는 이전에 다른 애플리케이션이 사용했던 garbage value가 남아있을 수 있다.)

3-2) ReferenceError

선언하지 않은 식별자에 접근하면 ReferenceError가 발생한다.

3-2) 변수 선언의 실행 시점과 변수 호이스팅

• 변수 선언뿐 아니라 var, let, const, function, function*, class 키워드를 사용해서 선언하는 모든 식별자(변수, 함수, 클래스)는 hoisting된다.
• 모든 선언문은 런타임 이전 단계에서 먼저 실행되기 때문이다.

4. 값의 할당/재할당

• 변수 선언은 런타임 이전에 먼저 실행되지만, 값의 할당은 시점인 런타임에 실행된다.

  console.log(score); // undefined
  var score;
  score = 1+2;
  console.log(score); // 80

• 변수에 값을 할당할 때는 이전 값 undefined가 저장되어 있던 메모리 공간을 지우고 그 메모리 공간에 새로운 할당 값을 저장하는 것이 아니라, 새로운 메모리 공간을 확보하고 그곳에 새 할당 값을 저장한다. 재할당할 때도 마찬가지이다.

  var result = 1 + 2;
  result = 10;

  재할당하게 되면 새로운 할당 값 이전 값인 undefined와 3은 어떤 변수도 갖지 않는다. 이는 불필요한 값들이 되어 garbage collector에 의해 메모리에서 자동 해제된다. 언제인지는 예측할 수 없다.

5. 식별자 네이밍 규칙

• 변수, 함수: camelCase
• 생성자 함수, 클래스: PascalCase

🙅 변수 선언에 별도의 주석이 필요하다면 변수의 존재 목적을 명확히 드러내지 못하는 것이다.

var x = 3; // NO
var scroe = 3; // OK