- 일반밸류
/* string copy, 원본과 복사된 값의 간섭이 없다 */
var str = "Tomorrow is on Friday";
var str2 = str;
str = "Tomorrow is not on Saturday";
console.log(str); // Tomorrow is not on Saturday
console.log(str2); // Tomorrow is on Friday
- 객체 복사
var obj = {name: "john", age: 20, school: "seneca"};
var objNested = {
name: "john",
age: 20,
school: {name: "seneca", course: "computer", class: ["tue", "thu", "fri"]},
family: ["dad","mom","brother"]
};
/* 객체복사 shallow copy 원본이 같이 변화한다 */
var obj2 = obj;
obj2.name = "tom";
console.log(obj); // {name: "tom", age: 20, school: "seneca"}
console.log(obj2); // {name: "tom", age: 20, school: "seneca"}
obj.age = 30;
console.log(obj); // {name: "tom", age: 30, school: "seneca"}
console.log(obj2); // {name: "tom", age: 30, school: "seneca"}
/* spread(...)를 통한 복사 - Deep Copy */
var obj2 = {...obj};
obj.name = "tom";
consol.log(obj); // {name: "tom", age: 20, school: "seneca"}
console.log(obj2); // {name: "john", age: 20, school: "seneca"}
var obj3 = {...obj, name: "park"}; // {name: "park", age: 20, school: "seneca"}
var objNested2 = {...objNested}; // nested 값이 같이 변경됨, 진정한 Deep Copy 아니다
objNested.school.name = "humber";
objNested.family[0] = "father";
/* Object.assign({}, obj) - Deep Copy */
var obj2 = Object.assign({}, obj);
obj.name = "tom";
consol.log(obj); // {name: "tom", age: 20, school: "seneca"}
console.log(obj2); // {name: "john", age: 20, school: "seneca"}
var objNested2 = Object.assign({}, objNested); // nested 값이 같이변경됨, 진정한 Deep Copy아니다
objNested.school.name = "humber";
objNested.family[0] = "father";
/* JSON parsing - Deep Copy */
var obj2 = JSON.parse(JSON.stringify(obj));
obj.name = "tom";
consol.log(obj); // {name: "tom", age: 20, school: "seneca"}
console.log(obj2); // {name: "john", age: 20, school: "seneca"}
var objNested2 = JSON.parse(JSON.stringify(objNested)); // objNested2의 nested 값은 변화없음, 진정한 Deep Copy
objNested.school.name = "humber";
objNested.family[0] = "father";
/* jQuery - Deep Copy */
var obj2 = $.extend(true, {}, obj);
obj.name = "tom";
consol.log(obj); // {name: "tom", age: 20, school: "seneca"}
console.log(obj2); // {name: "john", age: 20, school: "seneca"}
var objNested2 = $.extend(true,{},objNested); // objNested2의 nested 값은 변화없음, 진정한 Deep Copy
objNested.school.name = "humber";
objNested.family[0] = "father";
- 배열복사
var arr = ["baseball", "soccer", "basketball", "ballyball", "handball"];
var arrNested = ["baseball", "soccer", "basketball",
{america: "football", canada: "hockey",
north: ["america", "canada", "mexico"],
south: {win:"brazil", lose:"germany"}
},
"handball", [32,54,30,20], ["add", "substract", "multiple", "devide"]
];
/* 배열복사, 원본도 같이 변한다 - shallow copy */
var arr2 = arr;
arr[0] = "softball";
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["softball", "soccer", "basketball", "ballyball", "handball"]
/* Array.from() - Deep Copy */
var arr2 = Array.from(arr);
arr[0] = "softball";
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = Array.from(arrNested); // nested2 값이 같이 변경됨, 진정한 Deep Copy 아니다
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);
/* slice()사용, splice()는 원본이 []가 됨 - Deep Copy */
var arr2 = arr.slice(0);
arr[0] = "softball"
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = arrNested.slice(0); // nested2 값이 같이 변경됨, 진정한 Deep Copy 아니다
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);
/* spread 사용 - Deep Copy */
var arr2 = [...arr];
arr[0] = "softball"
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = [...arrNested]; // nested2 값이 같이 변경됨, 진정한 Deep Copy 아니다
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);
/* map() 사용 - Deep Copy */
var arr2 = arr.map(x => x);
arr[0] = "softball"
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = arrNested.map(x => x); // nested2 값이 같이 변경됨, 진정한 Deep Copy 아니다
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);
/* JSON parsing - Deep Copy */
var arr2 = JSON.parse(JSON.stringify(arr));
arr[0] = "softball"
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = JSON.parse(JSON.stringify(arrNested)); // nested2 값 변경없음, 진정한 Deep Copy
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);
/* jQuery - Deep Copy */
var arr2 = $.extend(true,[],arr);
arr[0] = "softball"
console.log(arr); // ["softball", "soccer", "basketball", "ballyball", "handball"]
console.log(arr2); // ["baseball", "soccer", "basketball", "ballyball", "handball"]
var arrNested2 = $.extend(true,[],arrNested); // nested2 값 변경없음, 진정한 Deep Copy
arrNested[3].america = "superball";
arrNested[3].north[1] = "CANADA";
arrNested[3].south.lose = "spain";
arrNested[5][3] = 300;
arrNested[6][2] = "minus"
console.log(arrNested);
console.log(arrNested2);