복제본으로서의 자바 스크립트 푸시

대화식 네트워크 응용 프로그램에 d3을 사용합니다. 상호 작용 중에 바 인딩해야하는 데이터가 변경되며 JSON 변수에서 선택된 일부 오브젝트로 구성됩니다.
JSON 변수에 map을 사용하고 적절한 개체를 선택하기위한 쿼리를 만들었습니다. 개체가 목록에 푸시되고이 목록이 새 데이터로 바인딩됩니다.
내 문제는 Javascript가 참조로 개체를 푸시합니다. d3이 멋진 데이터 수정을 수행하는 동안 JSON 변수가 지저분 해지고 쿼리가 더 이상 작동하지 않습니다.
JSON.stringify() 또는 jQuery.extend()과 같이 각 객체를 복사해야합니까, 아니면 데이터로 전달하는 객체 배열에서 JSON 변수를 분리하는 다른 해결책이 있습니까?복제본으로서의 자바 스크립트 푸시

출처

2016-07-25 Xenthor

[* "JavaScript에서 개체를 복제하는 가장 효율적인 방법은 무엇입니까?"] (/ q/122102)를보십시오. 'stingify()'/'parse()'를 사용하는 것은 그다지 좋지 않습니다. 이상적이지 않고 특별한주의가 필요한 몇 가지 문제가 있지만 가장 빠른 후보 일 것입니다. – altocumulus

모든 JS 객체는 참조 (객체, 배열, 함수 등)로 전달됩니다. 특정 개체의 '전체 복사본'을 만들려면 다음을 수행 할 수 있습니다.

var deepCopy = JSON.parse(JSON.stringify(oldObject)) // 1. - more of a hack 
var deepCopy = _.cloneDeep(oldObject); // 2. use some predefined methods from jQuery, lodash or any other library 

var shallowCopy = Object.assign({}, oldObject) // 1. - preferred (if you support new ES features)

이렇게하면 목록의 데이터가 수정되지 않습니다.

출처

2016-07-25 10:37:15

'JSON.parse (JSON.stringify (oldObject))'하지 마라. json을 실제로 사용하는 것은 해킹이므로 권장해서는 안됩니다. – WouterH

나는 해킹이 더 많음을 언급했다. –

또한'Object.assign'은 ES6 기능이기 때문에 모든 최신 브라우저에서 아직 지원되지 않는다. 예를 들어, Internet Explorer는 아직이 기능을 지원하지 않습니다. – LordTribual

복제본으로서의 자바 스크립트 푸시

답변

관련 문제