>웹 프론트엔드 >JS 튜토리얼 >JavaScript에서 객체 배열을 심층 복제하는 방법은 무엇입니까?

JavaScript에서 객체 배열을 심층 복제하는 방법은 무엇입니까?

Linda Hamilton
Linda Hamilton원래의
2024-12-13 04:59:10123검색

How to Deep Clone an Array of Objects in JavaScript?

JavaScript에서 객체 배열을 복제하는 방법은 무엇입니까?

JavaScript에서 복잡한 데이터 구조를 처리할 때 복제 대신 배열의 전체 복사본을 만드는 것이 도움이 되는 경우가 많습니다. 얕은 참조. 이렇게 하면 복제된 복사본의 변경 사항이 원본 어레이에 영향을 주지 않으며 그 반대의 경우도 마찬가지입니다.

전체 복사본 생성

structuredClone 사용

최신 배열의 심층 복제에 대한 접근 방식은 StructuredClone을 사용하는 것입니다. 방법:

array2 = structuredClone(array1);

이 방법은 대부분의 최신 브라우저에서 지원되며 안정적인 심층 복제 메커니즘을 제공합니다.

JSON.parse 사용

structuredClone을 사용할 수 없는 경우 JSON 기반 기술을 사용할 수 있습니다.

let clonedArray = JSON.parse(JSON.stringify(nodesArray))

이 접근 방식은 다음과 같은 객체에 효과적입니다. JSON 직렬화 가능. 즉, JSON 문자열로 변환하거나 그 반대로 변환할 수 있습니다. 그러나 함수나 특정 데이터 유형이 있는 복잡한 객체에는 적합하지 않을 수 있습니다.

확산 연산자 및 맵 사용

얕은 객체의 경우 맵과 결합된 스프레드 연산자를 사용하면 더 나은 성능을 제공할 수 있습니다.

clonedArray = nodesArray.map(a => ({...a}))

이 기술은 배열의 각 요소에 대해 새 객체를 생성하여 복제본에 대한 변경 사항이 영향을 미치지 않도록 합니다. 원본.

올바른 접근 방식 선택

객체 배열을 복제하는 가장 좋은 접근 방식은 특정 요구 사항에 따라 다릅니다. 안정적인 전체 복사를 위해서는 StructuredClone을 사용하는 것이 좋습니다. JSON 직렬화 가능 객체의 경우 JSON.parse 및 JSON.stringify는 유연한 옵션을 제공합니다. 얕은 객체의 경우 스프레드 연산자와 맵 방법이 더 나은 성능을 제공합니다.

위 내용은 JavaScript에서 객체 배열을 심층 복제하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.