EnJinnier

JS Deep Dive - 4.변수 본문

스터디/모던 자바스크립트 Deep Dive

JS Deep Dive - 4.변수

공학도진니 2024. 3. 15. 01:53

4.1 변수란 무엇인가?

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

변수이름(변수명) : 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름. 식별자라고도 함

변수값 : 변수에 저장된 값

할당(대입, 저장) : 변수에 값을 저장하는 것

참조 : 변수에 저장된 값을 읽어 들이는 것

변수 이름을 사용해 참조를 요청하면 자바스크립트 엔진은 변수 이름과 매핑된 메모리 주소를 통해 메모리 공간에 접근해서 저장된 값을 반환한다.

 

4.3 변수 선언

변수 선언 = 변수를 생성하는 것

var, let, const 키워드를 사용

var score; //변수 선언(변수 선언문)

 

위 코드는 변수를 선언만 하고 값을 할당하지는 않은 상태이다. 

다만 자바스크립트의 독특한 특징에 의해, 변수 선언에 의해 확보된 메모리 공간은

비어 있지 않고 undefined라는 값이 암묵적으로 할당되어 있다.

 

초기화 : 변수가 선언된 이후 최초로 값을 할당하는 것

(var 키워드로 선언한 변수는 undefined로 암묵적인 초기화가 자동 수행됨)

- 만약 초기화 단계를 거치지 않으면 쓰레기 값이 남아 있는데, 자바스크립트는 자동으로 undefined를 통해 초기화를 수행하므로 이러한 위험으로부터 안전하다.- 변수를 사용하려면 반드시 선언이 필요하며 선언하지 않은 식별자에 접근 시 ReferenceError(참조 에러)가 발생한다.

 

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

console.log(score); // undefined

var score; // 변수 선언문

 

위와 같은 코드가 있을때 변수 선언문보다 변수를 참조하는 코드가 앞에 있다.

이 경우 일반적으로는 참조 에러가 발생하지만, 자바스크립트는 소스코드를 실행하기에 앞서

변수 선언을 포함한 모든 선언문을 찾아 먼저 실행한다.

따라서 변수 선언이 소스코드의 어디에 위치하는지와 상관없이 어디서든지 변수를 참조할 수 있다.

위 코드의 경우 참조에러가 발생하지 않고 undefined가 출력된다.

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

 

4.5 값의 할당

다음 코드를 살펴보자.

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

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

 

자바스크립트 엔진은 변수 선언과 값의 할당을 하나의 문으로 단축 표현해도

변수 선언과 값의 할당을 2개의 문으로 나누어 각각 실행한다.

이때, 변수 선언과 값의 할당의 실행 시점이 다르다는 것을 주의해야 한다.

변수 선언 - 소스코드가 순차적으로 실행되는 시점인 런타임 이전에 먼저 실행

값의 할당 - 소스코드가 순차적으로 실행되는 시점인 런타임에 실행

 

consol.log(score); // undefined

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

console.log(score); // 80

 

변수는 새로운 값의 할당을 통해 계속해서 재할당을 할 수 있으며, 단 한번만 할당할 수 있는 변수는 상수(const)라고 한다.

 

4.7 식별자 네이밍 규칙

식별자(변수) 선언을 할때에는 다음과 같은 규칙을 준수해야 한다.

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

 - 단, 숫자로 시작하는 것은 허용하지 않는다.

 - 예약어(프로그래밍 언어에서 사용되고 있거나 사용될 예정인 단어)는 식별자로 사용할 수 없다.