자바 스크립트 객체의 복제본

Question

많은 중첩 객체가있는 큰 JS 객체가 있습니다. 예를 들어 :

var A = { 
    'b': { 
     c: [1], 
     d: { 
      e: { 
       f: 'g' 
      } 
     } 
    } 
}; 

나는 "B는"객체 "A"과 같은 객체를 생성해야하지만 배열 "BC"는 또 다른 하나 개의 항목이 포함되어 있어야합니다

var B = { 
    'b': { 
     c: [1, 2], 
     d: { 
      e: { 
       f: 'g' 
      } 
     } 
    } 
}; 

목적 "A를 "변경해서는 안됩니다.

이

1 깊은 복제 JS 객체 :

var B = JSON.parse(JSON.stringify(A)); // or with lodash: _.cloneDeep(A) 
B.b.c.push(2); 

2 복제

는 내가 필요로하는 그 객체와 배열을 복제하기 :

var B = Object.assign({}, A); 
B.b = Object.assign({}, B.b); 
B.b.c = B.b.c.slice(0); 
B.b.c.push(2); 

나는 그것을 할 수있는 두 가지 방법을 알고 첫 번째 방법은 자원 집약적 인 것 같습니다. 나는 모든 사물을 복제 할 필요가 없다. 두 번째 방법은 코드가 너무 많습니다. 내 예제에는 작은 객체가 있지만 애플리케이션에서 실제로 큰 객체가 될 수 있습니다.

최적의 방법으로 개체 "B"를 만드는 방법은 무엇입니까?

Answer 1

JSON.stringify/.parse은 확실히 (단순한) 개체를 딥 클론하는 가장 쉬운 방법이지만, 말했듯이 개체를 직렬화하고 파싱하는 것이 가장 효율적인 방법은 아닙니다.

다행히도 ES6에서는 상황이 개선되었습니다.

물론

var B = { ...A }; 

는 여전히 b.c에 문제있다,하지만 수동으로 조정할 수 있습니다 : 그리고 ESNext와 함께, 당신이 너무 객체를 확산 될 수

var B = { ...A, b: { ...A.b, c: [1, 2] }}; 

여기 객체 확산 연산자에 대한 바벨의 플러그인입니다 : https://babeljs.io/docs/plugins/transform-object-rest-spread/