변수와 식별자

Javascript

변수와 식별자

Yuna_dev 2021. 6. 14. 22:21

자바스크립트를 다루려면 데이터를 자바스크립트가 이해할 수 있는 형식으로 바꾸는 법을 알아야 한다.

변수와 상수, 리터럴은 자바스크립트가 데이터를 보관하는 메커니즘이다.

1. 변수

하나의 값을 저장하기 위해 확보한 메모리 공간 자체이면서, 그 메모리 공간을 식별하기 위해 붙인 이름

var 변수이름 = 값 ;

var 는 변수 선언을 의미하는 키워드이다. 소스를 해석하는 도중 var 를 만나면 "여기는 변수를 만들라는 말이군!" 으로 해석하여 변수를 만든다.
일반적으로 "=" 기준으로 저장소로 사용할 변수이름은 좌측, 저장할 데이터는 우측에 온다. ; (세미콜론)은 문장 맨 뒤에 붙이는 것으로 문장의 끝을 의미한다.
변수는 하나의 값을 저장하기 위한 수단이다. 그러나 객체나 배열 같은 자료구조를 사용하면 여러 개의 값을 하나로 그룹화해서 하나의 값처럼 사용할 수 있다.

// 하나의 값을 저장
var userId= 1;
var userName= 'cho';

// 여러개의 값을 그룹화하여 하나의 값처럼 사용
var user = {id: 1, name: 'cho'};

변수에 값을 저장하는 것을 할당(assignment 대입, 저장)이라 하고, 변수에 저장된 값을 읽어들이는 것을 참조(reference)라 한다.

1.1 변수가 왜 필요할까??

컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다. 메모리는 데이터를 저장할 수 있는 메모리 셀의 집합체이다. 메모리 셀 하나의 크기는 1byte(1bit)이며, 컴퓨터는 메모리 셀의 크기, 즉 1byte 단위로 데이터를 저장하거나 읽어들인다.
각 셀은 고유의 메모리 주소를 갖는다. 이 메모리 주소는 메모리 공간의 위치를 나타내며, 0부터 시작해서 메모리의 크기만큼 정수로 표현된다.
컴퓨터는 모든 데이터를 2진수로 처리한다. 따라서 메모리에 저장되는 데이터는 데이터의 종류(숫자, 텍스트, 이미지, 동영상 등)와 상관없이 모두 2진수로 저장된다.
저장된 데이터를 재사용하고 싶을 경우에는 메모리 주소를 통해 데이터가 저장된 메모리 공간에 직접 접근하는 것 이외에는 방법이 없다.
하지만 메모리 주소를 통해 값에 직접 접근하는 것은 치명적 오류를 발생시킬 가능성이 높은 위험한 일이다. 따라서 자바스크리브는 개발자의 직접적인 메모리 제어를 허용하지 않는다. 이처럼 메모리 주소를 통해 값에 직접 접근하려는 시도는 올바른 방법이 아니다.
프로그래밍 언어는 기억하고싶은 값을 메모리에 저장하고, 저장된 값을 읽어 들여 재사용하기 위해 변수라는 메커니즘을 제공한다.

2. 식별자

변수 이름을 식별자(identifier)라고도 한다. 식별자는 어떤 값을 식별할 수 있는 고유한 이름을 말한다.

값은 메모리 공간에 저장되어 있다. 식별자는 메모리 공간에 저장되어 있는 어떤 값을 구별해서 식별해낸다.
식별자는 값이 아니라 메모리 주소를 기억하고 있다. 식별자가 기억하고 있는 메모리 주소를 통해 메모리 공간에 저장된 값에 접근할 수 있다는 것을 의미한다.

즉, 식별자는 메모리 주소에 붙인 이름으로, 변수, 함수, class 이름이 이에 해당한다.

2.1 식별자 네이밍 규칙

1. var 1st = 10; => XX
2. var last_name; var value1; var lastname$; ....
3. var firstname; / var firstName; => 완전히 다른 변수
4. var Name="yuna"; => X / var name="yuna"; => O
5. var userName = "yuna"; /var selectMenuIndex = "1";

숫자로 시작할 수 없다.
특수문자를 제외한 문자, 숫자를 포함할 수 있다. 단, 특수문자 중에 언더스코어(_), 달러기호($)를 포함할 수 있다.
대소문자 구분을 한다. 이름이 같더라도 대소문자가 다르면 완전히 다른 변수로 해석한다.
변수는 대문자가 아닌 소문자로 시작한다.
여러 단어가 조합되는 경우 일반적으로 낙타 표기법(camelcase)으로 작성한다. 언더스코어를 사용하는 스네이크 케이스를 사용할 수도 있다. 식별자 네이밍 시에 띄어쓰기를 허용하지 않는다.

3. 변수 선언

변수를 선언하는 것은 값을 저장하기 위한 메모리 공간을 확보하고, 변수 이름과 확보된 메모리 공간의 주소를 연결해서 값을 저장할 수 있게 준비하는 것이다. 쉽게 말해서 변수를 생성하는 것이다.
변수를 사용하려면 반드시 선언이 필요하고, 선언을 할 때는 var, let, const 키워드를 사용한다. 변수뿐만 아니라 식별자(함수, 클래스 등)도 반드시 선언을 해야한다.
변수를 선언 후 변수에 값을 할당하지 않았을 경우, 해당 메모리 공간은 자바스크립트 엔진에 의해 undefined 라는 값이 암묵적으로 할당되어 초기화된다. 이것은 자바스크립트의 독특한 특징이다.
만약 선언하지 않은 식별자에 접근하면 ReferenceError(참조 에러)가 발생한다. 이는 자바스크립트 엔진이 값을 참조하려 했을 때, 식별자를 찾을 수 없을 때 발생한다.
초기화: 변수를 선언하고 메모리공간을 확보하여 값을 할당하는 것

3.1 변수 선언의 실행 시점_호이스팅

console.log(hoisting); //undefined
var hoisting="success";
console.log(hoisting); // 'success'

자바스크립트 코드는 인터프리터에 의해 한 줄씩 위에서부터 순차적으로 실행되므로 console.log(hoisting); 가 가장 먼저 실행되고 순차적으로 다음 줄에 있는 코드를 실행한다.
따라서 console.log(hoisting);가 실행되는 시점에는 아직 hoisting 변수의 선언이 실행되지 않았으므로 ReferenceError(참조 에러)가 발생할 것처럼 보인다.
하지만 참조에러가 발생하지 않고, undefined 가 출력된다.
그 이유는 변수 선언이 소스코드가 한 줄씩 순차적으로 실행되는 시점이 아닌 그 이전 단계(런타임 이전)에서 먼저 실행되기 때문이다.
즉, 자바스크립트 엔진은 변수 선언이 소스코드의 어디에 있든 상관없이 다른 코드보다 먼저 실행한다. 따라서 어디서든지 변수를 참조할 수 있다.

이렇게 변수 선언문이 코드의 해당 스코프 선두로 끌어 올려진 것처럼 동작하는 자바스크립트 고유의 특징을 '변수 호이스팅'이라한다.
호이스팅은 변수 선언 뿐만이 아니라 var, let, const, function, class 키워드를 사용하여 선언하는 모든 식별자는 호이스팅 된다.

4. 값의 할당

변수에 값을 할당(assignment)할 때는 할당 연산자(=)를 사용한다. 할당 연산자는 우변의 값을 좌변의 변수에 할당한다.
변수 선언과 값의 할당을 단축 표현할 수도 있다. 2개의 문으로 표현한 코드와 하나의 문으로 단축 표현한 코드는 정확히 동일하게 동작한다.

1. var result; // 변수 선언 result = 70; // 값의 할당 2. var result = 70; // 변수 선언과 값의 할당

이 때 주의할 점은 변수 선언과 값의 할당의 실행 시점이 다르다는 것이다.
변수 선언은 런타임 이전(1)에 먼저 실행되지만, 값의 할당(2)은 런타임에 실행된다는 것이다.

console.log(result); //undefined
var score; // 1- 변수 선언
score =80; // 2- 값의 할당
console.log(result); // 70

변수 선언과 값의 할당을 하나의 문으로 단축 표현을 해도 자바스크립트 엔진은 변수의 선언과 값의 할당을 2개의 문으로 나누어 각각 실행한다.
변수에 값을 할당할 때는 이전 값 undefined 가 저장되어 있던 메모리 공간을 지우고 그 메모리 공간에 값을 새롭게 저장하는 것이 아니라 새로운 메모리 공간을 확보하고 그곳에 할당 값을 저장한다.

4.1 값의 재할당

값의 재할당이란 이미 값이 할당되어 있는 변수에 새로운 값을 또다시 할당하는 것을 말한다. 재할당은 변수에 저장된 값을 다른 값으로 변경한다.
값을 재할당할수 없어서 변수에 저장된 값을 변경할 수 없다면 변수가 아니라 '상수'라 한다. 상수는 한번 정해지면 변하지 않는 값이다.

5. 가비지 콜렉터(garbage collector)

가비지 콜렉터는 애플리케이션이 할당한 메모리 공간을 주기적으로 검사하여 더 이상 사용되고 있지 않는 메모리를 해제(release)하는 기능을 말한다. 더 이상 사용되고 있지 않는 메모리란, 어떤 식별자도 참조하지 않는 메모리 공간을 의미한다.
메모리를 해제한다는 것은 네임 바인딩을 해제한다는 것( 네임 바임딩은 식별자와 값을 묶어놓은것) 이로써 메모리 공간을 새롭게 확보를 한다.