기본형 데이터와 참조형 데이터의 차이
변수 복사
var a = 10;
var b = a;
var obj1 = { c: 10, d: 'ddd' };
var obj2 = obj1;
기본형 데이터
변수 영역의 빈 공간 @1001을 확보하고 실별자 a로 지정한다.
숫자 10을 데이터 영역에서 검색하고 없으므로 빈 공간(@5001)에 저장한 다음, 이 주소를 @1001에 넣는다.
이 과정으로 기본형 데이터의 변수 선언 및 할당이 종료된다.
복사
변수 영역의 빈 공간(@1002)을 확보하고 식별자를 b로 지정한다.
이후 식별자 a를 검색해 그 값을 찾아온다.
@1001에 저장된 값인 @5001을 가져와 @1002에 값으로 대입한다.
참조형 데이터
변수 영역의 빈 공간 (@1003)을 확보해 식별자를 obj1로 지정한다.
데이터 영역의 빈 공간 (@5002)을 확보하고,
데이터 그룹이 담겨야 하기 때문에 별도의 변수 영역 @7103~을 확보해 그 주소를 저장한다.
@7103에서는 식별자 c를, @7104에는 식별자 d를 입력한 후, c에 대입할 값 10을 데이터 영역에서 검색한다.
@5001에 10이 이미 저장돼 있으므로 그 주소를 @7103에 연결하고,
문자열 'ddd'는 데이터 영역의 빈 공간에 새로 만들어 @7104dp 에 연결한다.
복사 과정에서는 변수 영역의 빈 공간 @1004를 확보하고 식별자를 obj2로 지정한다.
이제 식별자 obj1을 검색해 (@1003) 그 값인 @5002를 들고, @1004에 값으로 대입한다.
변수를 복사하는 과정은 기본형 데이터와 참조형 데이터 모두 같은 주소를 바라보게 되는 점에서 동일하다.
복사 과정은 동일하지만 데이터 할당 과정에서 이미 차이가 있기 때문에 변수 복사 이후의 동작에도 큰 차이가 발생한다.
var a = 10;
var b = a;
var obj1 = { c: 10, d: 'ddd' };
var obj2 = obj1;
b = 15;
obj2.c = 20;
b = 15; 에서 데이터 영역에 15가 없으므로 새로운 공간 @5004에 저장하고, 그 주소를 든 채로 변수 영역에서 식별자가 b인 주소를 찾는다.
obj2.c = 20; 에서 또한 20이 없으므로 새로운 공간 @5505에 저장하고, 그 주소를 가지고 변수 obj2를 찾아, obj2의 값인 @5002가 가리키는 변수 영역에서 c를 찾아(@7103) 그곳에 @5005를 대입한다.
기본형 데이터를 복사한 변수 b의 값을 바꾼 경우 @1002의 값이 달라진 반면,
참조형 데이터를 복사한 변수 obj2의 프로퍼티의 값을 바꾸었더니 @1004의 값은 달라지지 않았다.
즉, 변수 a와 b는 서로 다른 주소를 가리키게 됐으나, 변수 obj1과 obj2는 여전히 같은 객체를 가리키고 있다.
a ! === b
obj1 === obj2
위 결과는 기본형과 참조형 데이터의 가장 큰 차이점이다.
일반적으로 '기본형은 값을 복사하고 참조형은 주솟값을 복사한다.'라고 알고 있지만,
어떤 데이터 타입이든 변수에 할당하기 위해서는 주솟값을 복사해야 하기 때문에,
모든 데이터 타입은 참조형 데이터일 수 밖에 없다.
다만 기본형은 주소값을 복사하는 과정이 한 번만 이뤄지고,
참조형은 한 단계를 더 거치게 된다.
var a = 10;
var b = a;
var obj1 = { c: 10, d: 'ddd' }
var obj2 = obj1;
b = 15;
obj2 = { c: 20, d: 'ddd' };
obj2에 새로운 객체를 할당함으로써 값을 직접 변경했다.
이 경우 데이터 영역의 새로운 공간에 새 객체가 저장되고 그 주소를 변수 영역의 obj2 위치에 저장한다.
객체에 대한 변경임에도 값이 달라진다.
즉, 참조형 데이터가 '가변값'이라고 설명할 때의 '가변'은 참조형 데이터 자체를 변경할 경우가 아니라 그 내부의 프로퍼티를 변경할 때만 성립한다.