자바스크립트 DeepDive 4장 변수

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

• 컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해서 데이터를 기억
• 컴퓨터는 1바이트 단위로 데이터를 저장하거나 읽어들임.
• 메모리(memory)는 데이터를 저장할 수 있는 메모리 셀(memory cell)의 집합체
• 메모리(memory)는 주기억장치를 의미

https://www.crucial.kr/articles/about-memory/support-what-does-computer-memory-do

컴퓨터 메모리(RAM)란 무엇이며 어떤 역할을 합니까?메모리 영역는 무엇입니까?| |Crucial Korea

• 메모리(memory)
• 각 셀은 메모리 주소(memory address)를 가짐
  •  0부터 메모리 크기만큼 정수로 표현됨.
  •  메모리에 저장되는 데이터는 데이터의 종류(숫자, 텍스트, 이미지, 동영상 등)와 상관없이 모두 2진수로 저장됨.
   

• 현재 10 + 20 = 30의 연산이 성공적으로 끝났고, 연산 결과도 메모리에 저장되었지만 30을 재사용할 수 없음
• 재사용하기 위해서 변수 설정이 필요
• 변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름

- 식별자를 통해서 연산 결과에 접근할 수 있음

 

4.2 식별자

• 변수 이름을 식별자라고도 함.
• 식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름
• 식별자는 변수 이름에만 국한해서 사용하지 않음(변수, 함수, 클래스)

4.3 변수 선언(variable declaration)

• 변수 선언이란 변수를 생성하는 것
• 변수를 선언할 때는 var, let, const 키워드를 사용한다.
• ES5 vs ES6
• var는 함수 레벨 스코프

var str = '';

function getStr() {
  if(true) {
    str = 'eee';
  }
}

getStr();

console.log(str);

eee

 

- var는 변수 중복 선언을 허용함 (15.1 참고)

 

var x = 1;
var y = 1;

// var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용함.

var x = 100;
var y;

console.log(x); 100
console.log(y); 1

 

- let, const는 블록 레벨 스코프

const str = '';

function getStr() {
	 if(true) {
	   let str = 'abc';
   }
}

getStr();

console.log(str);

 

• 키워드는 자바스크립트 코드를 해석하고 실행하는 자바스크립트 엔진이 수행할 동작을 규정한 일종의 명령어
• 자바스크립트 엔진은 변수 선언을 다음과 같이 2단계에 거쳐 수행
• 선언 단계: 변수 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알림.
• 초기화 단계: 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화.
• 변수 이름을 비롯한 모든 식별자는 실행 컨텍스트에 등록됨.
• 실행 컨텍스트는 자바스크립트 엔진이 소스코드를 평가하고 실행하기 위해 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역

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

console.log(score); // undefined

var score; // 변수 선언문

• 자바스크립트 엔진은 소스코드를 2개의 과정(23.2)
• 소스코드의 평가: 실행 컨텍스트를 생성하고 변수, 함수 등의 선언문만 먼저 실행
• 소스코드의 실행: 선언문을 제외한 소스코드가 순차적으로 실행되기 시작
• 호이스팅이 발생하는 원인은 변수 선언과 초기화(할당)이 각각 진행되기 때문

4.5 값의 할당

• 변수에 값을 할당할 때는 할당 연산자 =를 사용함.
• 할당 연산자는 우변의 값을 좌변의 변수에 할당
• 변수 선언은 런타임 이전에 실행되고 값의 할당은 런타임에 실행

console.log(score);

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

console.log(score);

- 변수에 값을 할당할 때는 이전 값 undefined가 저장된 곳이 아닌 새로운 메모리 공간을 확보함

 

4.6 값의 재할당

• 이미 값이 할당되어 있는 변수에 새로운 값을 또다시 할당

var score = 80;
score = 90;

• const 키워드를 사용해 선언한 변수는 재할당이 금지, 그러나 불변을 의미하지 않기 때문에 프로퍼티 동적 생성, 삭제, 프로퍼티 값의 변경을 통해 객체를 변경하는 것은 가능(15)

4.7 식별자 네이밍 규칙

• 식별자는 어떤 값을 구별해서 식별해낼 수 있는 고유한 이름
• 특수문자를 제외한 문자, 숫자, 언더스코어(_), 달러 기호($)를 포함할 수 있음.
• 예약어는 사용될 수 없음.
• 변수는 쉼표(,)로 구분해 하나의 문에서 여러 개를 한번에 선언할 수 있음.

var person, $elem, _name, first_name, val1;