참조가 아닌 새로운 변수로 자바스크립트 객체를 복사하는 방법은 무엇입니까?
여기에 작은 JSON 개체를 새 변수로 전달하고 원래 변수(새 변수가 아님)의 데이터를 수정하는 빠른 jsfidle을 작성했지만 새 변수의 데이터도 업데이트됩니다.이것은 JSON 객체가 참조를 통해 전달되었다는 것을 의미하는 것이 틀림없죠?
내 빠른 코드는 다음과 같습니다.
var json_original = {one:'one', two:'two'}
var json_new = json_original;
console.log(json_original); //one, two
console.log(json_new); //one, two
json_original.one = 'two';
json_original.two = 'one';
console.log(json_original); //two, one
console.log(json_new); //two, one
원래 변수를 수정해도 새 변수가 수정되지 않도록 JSON 개체의 딥 카피를 만드는 방법이 있습니까?
편집: 이 대답은 2014년에 만들어졌으며, 현재 개체를 딥 클로닝하는 더 나은 방법이 있습니다.
jQuery를 사용하지 않고 단순 개체 복제에만 관심이 있다면 다음과 같은 기능이 있다는 것을 알게 되었습니다(댓글 참조).
JSON.parse(JSON.stringify(json_original));
문서화
유일한 방법은 개체를 복제하는 것입니다.
이를 달성하는 방법에 대한 이 스택 오버플로 질문을 참조하십시오.
간단한 JSON 객체의 경우 가장 간단한 방법은 다음과 같습니다.
var newObject = JSON.parse(JSON.stringify(oldObject));
jQuery를 사용하는 경우 다음을 사용할 수 있습니다.
// Shallow copy
var newObject = jQuery.extend({}, oldObject);
// Deep copy
var newObject = jQuery.extend(true, {}, oldObject);
업데이트 2017: 이것은 인기 있는 답변이기 때문에 이제 새로운 버전의 Javascript를 사용하여 이를 달성할 수 있는 더 나은 방법이 있음을 언급해야 합니다.
ES6 또는 TypeScript(2.1+)의 경우:
var shallowCopy = { ...oldObject };
var shallowCopyWithExtraProp = { ...oldObject, extraProp: "abc" };
참고: 만약extraProp
또한 oldObject의 속성입니다. 이 값은 다음과 같은 이유로 사용되지 않습니다.extraProp : "abc"
식의 뒷부분에 지정되어 있으므로 기본적으로 재정의합니다.물론 oldObject는 수정되지 않습니다.
언급URL : https://stackoverflow.com/questions/18359093/how-to-copy-javascript-object-to-new-variable-not-by-reference
'source' 카테고리의 다른 글
@Input() 값은 항상 정의되지 않습니다. (0) | 2023.07.26 |
---|---|
정규화된 테이블을 사용하는 것이 정말 더 나은가요? (0) | 2023.07.26 |
mysql 각 데이터 행의 마지막 N자를 다음 행으로 이동합니다. (0) | 2023.07.26 |
최대 절전 모드 - 배치 삽입이 실제로 수행되는지 확인하는 방법 (0) | 2023.07.26 |
routerLink 속성을 조건부로 비활성화하려면 어떻게 해야 합니까? (0) | 2023.07.26 |