🌱 변수(variable)란?
- 정의 : 하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위해 붙인 이름이다.
- 필요성 : 연산 결과를 재사용하고 싶다면 메모리 주소에 직접 접근해야 하는데, 메모리 직접 제어는 시스템을 멈추게 하는 치명적인 오류를 발생시킬 위험이 있다. 직접 제어를 하더라도 코드가 실행될 때 메모리 상황에 따라 임의로 메모리 주소가 결정되기 때문에 접근할 수 없다. 값을 저장하고 안전하게 참조하기 위해 변수가 필요하다.
🌱 용어 정리
할당(assignment): 변수에 값을 저장하는 것. (대입, 저장)참조(reference): 변수에 저장된 값을 읽어 들이는 것.식별자(identifier): 어떤 값을 구별해서 식별할 수 있는 고유한 이름으로, 값이 아니라 메모리 주소를 기억한다. 즉, 메모리 주소에 붙인 이름이다. (변수명, 함수명, 클래스명 등)선언(declaration): 변수를 생성하는 것. 즉, 값을 저장하기 위한 메모리 공간을 확보(allocate)하고 변수명과 확보된 메모리 공간의 주소를 연결(name binding)해서 값을 저장할 수 있게 준비하는 것.
🌱 변수 선언 단계
- 선언 단계 : 변수 이름을 등록해서 자바스크립트 엔진에 변수의 존재를 알리는 단계. (변수 이름을 비롯한 모든 식별자는 실행 컨텍스트 내에 key-value 형식으로 등록되어 관리된다.)
- 초기화 단계 : 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화하는 단계. (초기화 단계를 거치지 않으면 이전에 사용했던 값인 쓰레기 값이 남음)
🌱 변수 선언 키워드
var: 선언 단계와 초기화 단계가 동시에 진행되는 키워드 (재선언 가능)let: 재선언 불가, 재할당 가능한 키워드const: 값을 재할당 할 수 없는 상수(constant) 키워드
🌱 호이스팅(hoisting)
- 정의 : 변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징이다.
예제)
console.log(score); // undefined
var score;
score = 80;
console.log(score); // 80변수 선언문보다 변수를 참조하는 코드가 먼저 있어서 참조 에러가 발생할 것 처럼 보이지만, 참조 에러가 발생하지 않고 undefined가 출력된다. 그 이유는 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점인 런타임(runtime)이 아니라 이전 단계에서 먼저 실행되기 때문이다.
값의 할당과 재할당은 런타임에 실행되며, 기존 undefined가 저장되던 공간이 아닌 새로운 메모리 공간 확보 후 저장된다. 이후 사용하지 않는 값은 가비지 콜렉터에 의해 자동으로 해제된다.
자바스크립트 엔진은 소스코드를 한 줄씩 실행하기 앞서 소스코드의 평가 과정을 먼저 거치면서 실행 준비를 한다. 이 때, 모든 선언문을 소스코드에서 찾아서 먼저 실행한다. 평가 과정이 끝난 후, 선언문을 제외한 소스코드를 순차적으로 실행한다.
🌱 식별자 네이밍 규칙
- 특수문자를 제외한 문자, 숫자, 언더스코어(_), 달러 기호($)를 포함할 수 있다. (단, 숫자로 시작할 수 없다.)
- 예약어는 식별자로 사용할 수 없다.
- 대소문자를 구분한다.
var firstName; // 카멜 케이스 : 주로 변수, 함수에 사용
var first_name; // 스네이크 케이스
var FirstName; // 파스칼 케이스 : 주로 생성자 함수, 클래스에 사용
var strFirstName; // 헝가리안 케이스| 참고 자료 |
모던 자바스크립트 Deep Dive
FE developer