javaScript 에서 "얕은 복사" 와 "깊은 복사" 는 무엇이 다른건가요??

Question

객체등을 복사할때 흔히들 얕은 복사인가, 깊은 복사인가에 따라서 결과가 많이 바뀔수 있다고들 합니다.

이때 두 복사의 차이점이 자세히 알고 싶습니다.

프알못 · Accepted Answer

일단 대입과 복사의 차이부터 보겠습니다.var original = {
  some_value: 123
};

// original을 new_one에 "대입"합니다.
var new_one = original;
// new_one의 속성을 바꾸면 original의 속성도 바뀝니다.
new_one.some_value = 456;
// 심지어 새로운 속성을 만들 수도 있습니다.
new_one.another_value = 789;

console.log(original);대입은 하나의 객체를 여러 변수가 가리키게 할 뿐입니다. (기본형은 복사됩니다.)var original = {
  some_value: 123
};

// original을 new_one에 "복사"합니다. (모든 속성을 대입합니다.)
var new_one = Object.assign({}, original);
// new_one은 이제 original과 별개의 객체입니다.
new_one.some_value = 456;
// 원래 객체에 영향을 주지 않습니다.
new_one.another_value = 789;

console.log(original);복사는 같은 객체를 가리키는 게 아니라 객체를 하나 더 만들고 모든 속성을 복사합니다.복사본으로는 원본에 영향을 줄 수 없는 것 같지만, 속성이 객체면 문제가 생길 수 있습니다.var original = {
  name: {
    en_us: 'Original',
    ko_kr: '원본'
  }
};

// original을 new_one에 "복사"합니다.
var new_one = Object.assign({}, original);
// 하지만 속성을 "대입"했기 때문에...
new_one.name.en_us = 'Copy';
// original.name과 new_one.name은 같은 객체를 가리키고 있습니다.
new_one.name.ko_kr = '복사본';

console.log(original);이렇게 단순히 모든 속성을 대입한 복사를 얕은 복사라고 합니다.function clone(obj) { // 객체를 복제하는 예시 코드입니다.
    var ret = {}; // 모든 속성을 (object인 경우 재귀적으로) 복제합니다.
    for(var k in obj) {
        ret[k] = typeof obj[k] === 'object' && obj[k] != null ? clone(obj[k]) : obj[k];
    }
    return ret;
}

var original = {
  name: {
    en_us: 'Original',
    ko_kr: '원본'
  }
};

// original을 new_one에 "복제"합니다.
var new_one = clone(original);
// 모든 속성을 "복사"한 것입니다. 얕은 복사에서는 모든 속성을 "대입"했습니다.
new_one.name.en_us = 'Copy';
// original.name과 new_one.name은 서로 다른 객체입니다.
new_one.name.ko_kr = '복사본';

console.log(original);모든 속성을 재귀적으로 복사해야 정말 원본과 별개의 객체가 만들어지는데, 이를 깊은 복사라고 합니다.

생활꿀팁

생활꿀팁

javaScript 에서 "얕은 복사" 와 "깊은 복사" 는 무엇이 다른건가요??