자바스크립트 입문_변수의 복사

var a = 10 ;
var b = a ;

var obj1 = {c:10, d:'ddd'}
var obj2 = obj1;

위의 코드가 실행되면서 발생하는 메모리 할당내역.

 

<변수영역>

주소	1001	1002	1003	1004	.....
데이터	이름: a 값 : @5001	이름: b 값 : @5001	이름: obj1 값 : @5002	이름: obj2 값: @5002

<데이터 영역>

주소	5001	5002	5003	5004	......
데이터	10	@7103 ~ ?	'ddd'

<객체 @5002의 변수 영역>

주소	7103	7104	....
데이터	이름 : c 값 : @5001	이름 : d 값 : @5003

• 위처럼 알수 있듯이 변수가 복사됨에 따라 변수자체에 새로운공간이 할당될 뿐 내부의 값은 이전에 존재하던 변수영역 및 데이터 영역에서 값을 찾아서 가지고오게 됨.
• 만일 obj2에 할당되는 변수만 찾아서 변경하는경우와 obj2를 아예 새로운 객체로 변경하는 두가지 방법의 차이가 있을 수 있는데, 

obj2.c = 20; //첫번째 케이스
obj2 = { c : 20 , d : 'ddd' } //두번째 케이스

• 첫번째와 두번째 케이스를 비교할때 첫번째 케이스의 경우 c에서 할당되는 20만 새로운 데이터영역에 저장하고 그 참조를 obj2 의 변수영역에서 참조하는 메모리값만 변경해주지만, // 두번째의 경우에는 obj2의 데이터를 다른 메모리값에 저장해 obj1과 obj2의 메모리 참조값이 달라지게 됨.

 

<실행 예시_case1>

var obj1 = {c : 10 , d : 'ddd'};
console.log(obj1);

var obj2 = obj1;
console.log(obj2);

obj2.c = 20;

console.log(obj1, obj2);

{
	c:10,
	d:"ddd"
}

{
	c:10,
	d:"ddd"
}

{
	c:20, 
	d:"ddd"
}

{
	c:20, //obj1과 obj2의 값이 모두 변함
	d:"ddd"
}

<실행 예시_case2>

var obj1 = {c : 10 , d : 'ddd'};
console.log(obj1);

var obj2 = obj1;
console.log(obj2);

obj2 = {c : 20, d : 'ddd'};

console.log(obj1, obj2);

{
	c:10,
	d:"ddd"
}

{
	c:10,
	d:"ddd"
}

{
	c:10, //obj1의 값은 변하지 않음
	d:"ddd"
}

{
	c:20, //obj2의 값은 변함
	d:"ddd"
}