하나의 값을 저장하기 위해 확보한 메모리 공간 자체 또는 그 메모리 공간을 식별하기 위한 이름.
👉 프로그래밍 언어에서 값을 저장하고 참조하는 메커니즘으로 값의 위치를 가리키는 상징적인 이름.
기억하고 싶은 값을 메모리에 저장하고, 저장된 값을 읽어 들여 재사용을 할 때,
직접 메모리 주소를 통해 값을 저장하고 참조할 필요 없이 변수를 통해 안전하게 값에 접근할 수 있기 때문.
👉 변수이름 : 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름.
👉 변수 값 : 변수에 저장된 값
👉 할당assignment (대입, 저장) : 변수에 값을 저장하는 것
👉 참조reference : 변수에 저장된 값을 읽어 들이는 것
🔖 참고) JS Engine :CPU를 사용해 연산을 하고 memory를 사용해 데이터를 기억한다.
어떤 값을 구별해서 식별할 수 있는 고유한 이름
식별자는 값이 아니라 메모리 주소를 기억하고 있음. (값은 메모리 공간에 저장되어 있기 때문)
변수는 식별자에 포함되는 개념
값을 저장하기 위한 메모리 공간을 확보(allocate)하고 변수 이름과 확보된 메모리 공간의 주소를 연결(name binding)해서 값을 저장할 수 있게 준비하는 것.
👉 변수를 생성하는 것. 변수를 사용하기 위해 선언이 반드시 필요.
var 키워드는 ES6 이전에 변수를 선언하기 위한 유일한 방법
새로운 변수를 선언할 것을 지시하는 keyword
✔️ 변수 중복 선언 허용
✔️ function-level-scope (block-level-scope를 지원하지 않음) 👉 함수 외부에서 var keyword로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다. 전역 변수가 중복 선언될 가능성.
✔️ 변수 호이스팅 👉 프로그램의 흐름상 맞지 않고, 가독성 떨어뜨림, 오류를 발생시킬 여지 남김.
🔖 참고 ) Keyword : 자바스크립트 코드를 해석하고 실행하는 자바스크립트 엔진이 수행할 동작을 규정한 일종의 명령어. JS Engine은 keyword를 만나면 자신이 수행해야 할 약속된 동작을 수행함.
✔️ var는 function-scoped이고 let과 const는 block-scoped 이다.
✔️ var와 달리 let과 const는 변수 재선언이 불가능하다.
✔️ let은 변수에 재할당이 가능하지만, const는 재할당 불가능!
🔖 참고) function-scope : 함수 단위로, 함수 밖에서 선언한 변수는 전역변수
block-scope : 대괄호 단위로, 대괄호 밖에서 선언한 변수는 전역변수
참고한 자료) https://gist.github.com/LeoHeo/7c2a2a6dbcf80becaaa1e61e90091e5d
- 선언 단계 : 변수 이름을 등록해서 자바스크립트 엔진의 변수의 존재를 알림
- 초기화 단계 : 값을 저장하기 위한 메모리 공간을 확보하고 암묵적으로 undefined를 할당해 초기화한다.
변수 이름을 비롯한 모든 식별자는 실행 컨텍스트(execution context)에 등록된다.
🔖 참고 ) ReferenceError ? 식별자를 통해 값을 참조하려 했지만 자바스크립트 엔진이 등록된 식별자를 찾을 수 없을 때 발생하는 에러
변수 선언은 소스코드가 한 줄씩 순차적으로 실행되는 시점(runtime) 이전에 "소스코드의 평가과정"에서 실행된다.
🔖 참고 ) 자바스크립트 엔진은 소스코드를 한 줄씩 순차적으로 실행하기에 앞서 먼저 소스코드의 평가 과정을 거쳐서 소스코드를 실행하기 위한 준비를 한다.
이 때 자바스크립트 엔진은 변수 선언을 포함한 모든 선언문을 먼저 실행 👉 소스코드 한 줄 씩 순차적으로 실행
변수 선언문이 코드의 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징 (변수 선언이 소스 코드의 어디에 있든 상관없이 다른 코드보다 먼저 실행이 되는 것.)
변수 선언은 소스코드가 순차적으로 실행되는 시점인 런타임 이전에 먼저 실행되지만, 값의 할당은 소스코드가 순차적으로 실행되는 시점인 런타임에 실행된다.
🔖 참고 ) 재할당 : 이미 값이 할당되어 있는 변수에 새로운 값을 또다시 할당하는 것.
단 한 번만 할당할 수 있는 변수
이전 값이 저장되어있던 메모리 공간을 지우고, 그 메모리 공간에 재할당 값을 새롭게 저장하는 것이 아니라 새로운 메모리 공간을 활보하고 그 메모리 공간에 새로운 값을 저장한다.
🔖 참고 ) 이전 값들은 더이상 필요하지 않으니 garbage collector에 의해 메모리에서 자동 해제된다. garbage collector는 애플리케이션이 할당한 메모리 공간을 주기적으로 검사하여 더 이상 사용되지 않는 메모리를 해제하는 기능을 말함.
🔖 참고 ) 자바스크립트는 매니지드 언어(managed language). 메모리의 할당 및 해제를 위한 메모리 관리 기능을 언어 차원에서 담당하고 개발자의 직접적인 메모리 제어를 허용하지 않는 것.
👉 식별자는 특수문자를 제외한 문자, 숫자, 언더스코어(_), 달러 기호($)를 포함할 수 있다.
👉 단, 식별자는 특수문자를 제외한 문자, 언더스코어, 달러 기호로 시작해야 한다. 숫자로 시작하는 것은 허용하지 않음.
👉 예약어는 식별자로 사용할 수 없다.
🔖 참고 ) 예약어(reserved word)란? 프로그래밍 언어 안에서 사용되고 있거나 사용될 예정인단어들 ex) await, break, catch, class 등 등
변수이름으로 first-name 허용되지 않음.
🔖 참고 ) 네이밍 컨벤션(naming convention)
1. camelCase ex) firstName
2. snake_case ex) first_name
3. PascalCase ex) FirstName
4. typeHungarianCase ex) strFirstName (type + indentifier), $elem
자바스크립트에서는 일반적으로 변수나 함수의 이름에는 카멜케이스, 생성자 함수와 클래스의 이름에는 파스칼 케이스르 사용.