얕은 복사 VS 깊은 복사

• 얕은 복사(shallow copy)는 바로 아래 단계의 값만 복사함
  중첩된 객체에서 참조형 데이터가 저장된 프로퍼티를 복사할 때 그 주솟값만 복사한다는 의미
  해당 프로퍼티에 대해 원본과 사본이 모두 동일한 참조형 데이터의 주소를 가르키게 됨
  사본을 바꾸면 원본도 바뀌고 원본을 바꾸면 사본도 바뀜
• 깊은 복사(deep copy)는 내부의 모든 값들을 하나하나 찾아서 전부 복사함

중첩된 객체에 대한 얕은 복사

			var copyObject = function (target) {
				var result = {};
				for (var prop in target) {
					result[prop] = target[prop];
				}
				return result;
			};

			var user = {
				name: "kyochon",
				urls: {
					website: "https://kc.com",
					blog: "http://blog.com",
					instagram: "http://insta.com",
				},
			};

			var user2 = copyObject(user);

			user2.name = "bbq";
			console.log(user.name === user2.name); //false

			user.urls.website = "https://kc2.com";
			console.log(user.urls.website === user2.urls.website); //true

			user2.urls.blog = "";
			console.log(user.urls.blog === user2.urls.blog); //true

 

 

중첩된 객체에 대한 깊은 복사

			var copyObject = function (target) {
				var result = {};
				for (var prop in target) {
					result[prop] = target[prop];
				}
				return result;
			};

			var user = {
				name: "kyochon",
				urls: {
					website: "https://kc.com",
					blog: "http://blog.com",
					instagram: "http://insta.com",
				},
			};

			var user2 = copyObject(user);

			user2.urls = copyObject(user.urls);

			user.url.website = "https://kc2.com";
			console.log(user.urls.website === user2.urls.website); //false

			user2.url.blog = "";
			console.log(user.urls.blog === user2.urls.blog); //false

• user,urls 프로퍼티에에 대해서도 불변 객체로 만듦(깊은 복사)
• 객체의 프로퍼티 중에서 그 값이 기본형 데이터일 경우에는 그대로 복사하고
  참조형 데이터는 다시 그 내부의 프로퍼티들을 복사해야 한다