[JavaScript] JSON 객체 참조/복사 (얕은 복사, 깊은 복사)

 

 

 

 

 

얕은 복사 (참조)

값이 아닌 값의 레퍼런스를 복사한다. 즉, 객체를 참조한다.

 

$(document).ready(function(){
	var jsonObj = [{ "NAME":"ggmouse" }, {"NAME":"woo"}, {"NAME":"kim"}]; 
 
	var shallowCopy = jsonObj; // 얕은복사 (객체 참조)	

	shallowCopy[0].NAME = "gg";
	console.log("shallowCopy[0].NAME : " + shallowCopy[0].NAME);
	console.log("jsonObj[0].NAME : " + jsonObj[0].NAME);
});

 

결과

 

var shallowCopy = jsonObj;

 

shallowCopy는 jsonObj객체를 참조하게 됐다.

 

그래서 shallowCopy[0].NAME 값이 "gg"로 변경되면, 참조하고 있는 jsonObj[0].NAME 역시 "gg"로 변경된다.

 

 

 

 

깊은 복사 (복사)

실제 순수 값을 복사한다.

 

$(document).ready(function(){
	var jsonObj = [{ "NAME":"ggmouse" }, {"NAME":"woo"}, {"NAME":"kim"}]; 
 
	var deepCopy = JSON.parse(JSON.stringify(jsonObj)); // 깊은복사 (객체 복사)
	
	deepCopy[0].NAME = "gg";
	console.log("deepCopy[0].NAME : " + deepCopy[0].NAME);
	console.log("jsonObj[0].NAME : " + jsonObj[0].NAME);
});

 

결과

var deepCopy = jsonObj;

 

deepCopy는 jsonObj객체를 참조가 아니라 레퍼런스의 데이터 자체를 복사했다.

 

따라서 deepCopy[0].NAME 값이 "gg"로 변경하게 되더라도, 참조하고 있는 jsonObj[0].NAME 값은 원본인 "ggmouse" 값을 가진다.

 

 

 

 

 

[JavaScript] JSON 데이터 다루기 JSON.parse, JSON.stringfy