[Javascript] Json Copy. DeepCopy

 

아래와 같은 코드가 있을 때, 결과를 예상해 보세요.

let myScore = {
  "Math": 50,
  "Eng": 40,
  "Kor": 45
}

let yourScore = myScore

yourScore.Eng = 90

console.log(yourScore.Eng)
console.log(myScore.Eng)

.

.

.

.

.

결과는
90
90
입니다.

 

자바스크립트에서 JSON 객체를 복사할 때, 깊은 복사와 얕은 복사라는 개념이 있습니다.
(다른 언어에도 있습니다.)

 

DeepCopy 깊은복사

깊은 복사란, JSON 객체를 복사할 때, 객체가 가리키고 있는 모든 객체를 새로운 객체로 복사하는 것을 말합니다. 이렇게 복사하면 원본 객체와 복사된 객체는 서로 완전히 독립적인 객체가 됩니다.

const _ = require('lodash');
const R = require('ramda');

let original = {a: 1, b: {c: 2}};

// 방법1
let copied1 = JSON.parse(JSON.stringify(original));

// 방법2
let copied2 = {...original};

// 방법3
let copied3 = Object.assign({}, original);

// 방법4 (lodash 사용)
let copied4 = _.cloneDeep(original);

// 방법5 (Ramda 사용)
let copied5 = R.clone(original);

copied1.a = 10
copied2.a = 20
copied3.a = 30
copied4.a = 40
copied5.a = 50

console.log(original.a)
console.log(copied1.a)
console.log(copied2.a)
console.log(copied3.a)
console.log(copied4.a)
console.log(copied5.a)

 

 

참고
ShallowCopy (얕은 복사)란, JSON 객체를 복사할 때, 객체가 가리키고 있는 객체를 새로운 객체에서도 가리키도록 복사하는 것을 말합니다. 이렇게 복사하면 원본 객체와 복사된 객체는 서로 연결되어 있습니다.