천천히 하지만 더 멀리

Javascript [ 변수 ] 본문

JavaScript

Javascript [ 변수 ]

PJamesY 2021. 12. 26. 14:47

1. 변수란 무엇인가??

정의

컴퓨터는 CPU를 사용해 연산하고, 메모리를 사용해 데이터를 기억한다.

메모리에 저장된 값의 위치를 가리키는 상징적인 이름을 변수라고 한다.

변수라는 것을 통해 개발자는 안전하게 메모리에 있는 값에 접근할수 있다.

 

기본적으로 변수는 하나의 값만 저장할수 있다.

여러개의 값을 저장하려면 여러개의 값을 그룹화해서 변수에 저장할수 있다.

let id = 1;
let name = 'james';

// 객체나 배열을 이용해서 그룹화해서 여러개의 값을 변수에 저장할수 있다.
let person = { name: 'james', age: 23 }
let numbers = [1, 2, 3, 4]

용어

  • 변수 이름 ( 변수명 ) : 메모리 공간에 저장된 값을 식별할 수 있는 고유한 이름
  • 변수 값 : 변수에 저장된 값
  • 할당 ( 대입, 저장 ) : 변수에 값을 저장하는 것
  • 참조 : 변수에 저장된 값을 읽는 것  

2. 식별자

변수 이름을 식별자(identifier) 라고도 한다.

식별자는 값이 아니라 메모리 주소를 기억하고 있다. 

변수뿐만 아니라 함수, 클래스등의 이름도 모두 식별자이다.

3. 변수 선언

1. 값을 저장하기 위한 메모리 공간을 확보

2. 변수 이름과 메모리 공간의 주소를 연결

3. 값을 저장할수 있게 준비

 

변수를 사용하려면 반드시 선언이 필요하다!!

 

var user;

var 키워드를 이용하여 변수를 선언하였다.

var 키워드를 사용한 변수 선언은 선언 단계초기화 단계가 동시에 진행된다.

var user; 는 선언 단계를 통해 변수 이름 user 를 등록하고, 초기화 단계를 통해 user 변수에 암묵적으로 undefined 를 할당해 초기화

var 키워드는 암묵저으로 undefined 로 초기화 하므로 남아 있는 값이 나올리는 없다.

4. 변수 호이스팅

console.log(user); // undefined

var user; // 변수 선언문

소스가 실행되는 시점에서 console.log(user) 는 참조 에러를 발생하는게 아닌 undefined 가 출력된다.

변수 호이스팅이 된것이다!!

왜 이러한 현상이 일어나는 것일까? 

자바스크립트 엔진은 변수 선언을 포함한 모든 선언문을 소스코드에서 찾아내 먼저 실행한다.

즉 자바스크립트 엔진은 변수 선언이 소스코드의 어디에 있든 상관없이 다른 코드보다 먼저 실행되기 때문이다. 

var, let, const, function, function*, class 키워드를 사용해서 선언하는 모든 식별자(변수, 함수, 클래스 등)는 모두 호이스팅된다.

5. 변수에 값 할당

var number = 7 // 변수 선언과 값의 할당

우리는 평소에 위와 같이 변수 선언과 할당을 같이 할때가 있어서 동시에 진행되는줄 알고 있을수있다.

var number; // 변수 선언문
number = 7 // 변수에 값 할당

하지만 사실 선언과 값의 할당은 실행시점이 다르다. 

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

즉 선언이 먼저 되고 해당 변수에 값을 할당합니다.

그리고 또 하나 알아두어야 할게 선언이 될때 undefined 가 자동으로 초기화되고 같은 메모리 공간에 7 이 저장되는게 아니다.

조금 더 이해하기 쉽게 밑에 그림으로 이해해보자.

 

주소는 임의로 정수 숫자로 하였다. 여기에서 중요한건 값을 할당할때 새로운 메모리를 확보한다는 것이다.

 

Reference

책 모던 자바스크립트 Deep Dive 를 공부하며 정리하였습니다.

Comments