들어가며...
코드스테이츠 수업이 본격적인 자바스크립트 동작원리 파트로 넘어갔다.
이전까지 단순히 어떻게 사용하면 된다~
라는 how to use 식이였다면,
이번 수업부터 what's that 식으로 좀 더 깊이 알아보는 식이다.
가장 먼저 변수를 선언하고 할당한다.
이를 좀 더 깊게 풀어 써서 변수/식별자/데이터 주소 등으로 설명하여
스택/힙 에 대한 개념과 같이 블로깅 하고자 한다.
자료형의 종류
-
원시 값 (언어의 최고 로우레벨에서 직접 표현되는 불변 데이터)
1.Boolean 타입
2.Null 타입
3.Undefined 타입
4.Number 타입
5.BigInt 타입
6.String 타입
7.Symbol 타입 -
객체 (속성의 컬렉션)
로 이루어져있다.
특히 자바스크립트의 특징으로는 숫자형이 Number하나만 있다는 것이다.
다른 언어의 경우 실수,정수 등 여러가지가 있고
특히나 정수형 타입(short)은 2^16비트 = 2바이트를 할당해서
65536개의 숫자.
-32768 ~ + 32767 의 숫자만을 허용한다.
하지만 자바스크립트는 메모리 공간을 넉넉하게 8비트를 확보해서 사용한다.
또한 메모리에서 각 비트는 고유한 식별자를 가진다.
바이트 역시 비트의 식별자로 위치를 파악한다.
그러므로 모든 데이터는 바이트 단위의 식별자.
메모리 주솟값을 통해 서로 구분/연결 한다.
데이터 할당
var a; 변수 a 선언
a ='abc'; 변수 a에 데이터 할당
var a = 'abc'; 변수 선언과 데이터할당을 동시에위의 보통 변수의 선언과 할당을 표현한 식이 있다.
문법 상 var a는 그냥 변수 a라고 부른다.
하지만 a를 따로 부르면 정확히는 어떻게 불러야 할까?
식별자라고 부른다.
이제 식별자를 통해 저 코드가 어떻게 작동되는지 파헤쳐보자.
처음에 원시 자료형의 설명을 들으면 불변되고, 수정할수없고, 각자 고유한 값을 갖는다고 배운다.
그래서 다들 다음과 같이 이해할것이다.
하지만 실제로는 이렇게 된다.
변수를 선언하고 값으로 메모리 주솟값을 할당했다.
그리고 주솟값을 통해 데이터 영역에 있는 값을 불러왔다.
굳이 왜 이렇게 하는 걸까?
설명하기 앞서서 a의 값을 abcdef로 재할당 해보자.
var a = 'abc';
a = 'abcdef';
5005번의 자리에 abcdef를 추가하고 a를 식별자로 갖는 주소의 값이 변한다.
자 이제 메모리영역에 직접적으로 값을 안 넣고 주소값을 넣는 이유를 알아보자.
500개의 변수를 지정해서 값을 a에 넣으면
(500 * 8) = 4000 의 용량이 필요하다.
하지만 주소로 지정해 두면 한번만 불러오면 되므로
(500 * 2 + 8)이 되서 1008의 용량만 필요하다.
불변값, 가변값
앞서 데이터 할당이 어떻게 이뤄지는지 대략 알아봤다.
정확히는 원시데이터가 왜 불변하는 속성을 갖는지 말이다.
데이터 영역에서 값은 주소를 참조하고,
abc를 abcdef 로 재할당 한다고 선언해도
실제로는 새롭게 메모리주소를 할당하고 주소를 연결해 줄 뿐이지,
abc자체를 수정하지 않음을 말이다.
그렇다면 원시데이터가 아닌 객체는 어떻게 값이 변경 될까?
사전적으로는 값이 변경된다고도 되있다.
이를 가변값이라고 한다.
먼저 객체를 살펴보자.
var obj1 = {
a:1,
b: 'bbb'
};
원시데이터와 다르게 값에 데이터주소를 넣고 또 그곳에 데이터주소를 넣은 것을 확인할 수 있다.
보통 객체 내부에서 전의 index처럼 쓰이는 부분을 객체의 프로퍼티(property)라고 부르는데,
정확히는 객체 내부의 변수 라는걸 알수있다.
데이터 영역은 한번 할당 되면 값이 절대 변하지 않는데,
변수영역을 만들어 재할당 할수있도록 말이다.
이를 재할당 하면 다음과 같이 변한다.
var obj1 = {
a:1,
b: 'bbb'
};
obj1.a = 2;
데이터 영역에서 2 가 있는지 확인한 뒤 없으므로 2의 영역을 만들어주고, 프로퍼티의 주소를 수정했다.
원리자체는 똑같이 주소를 복사함을 알수있다.
다음으로는 참조형안에 참조형을 할당하는 경우이다.
var obj = {
x: 3,
y: [3, 4, 5]
}
