>  기사  >  웹 프론트엔드  >  js의 딥 카피와 얕은 카피에 대한 간략한 분석

js의 딥 카피와 얕은 카피에 대한 간략한 분석

不言
不言앞으로
2018-10-20 14:33:062780검색

이 글은 js의 딥 카피와 얕은 카피에 대한 간략한 분석을 제공합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

딥 카피와 얕은 카피는 사실 상대적으로 기본적인 두 가지 개념이지만, 여전히 매우 흥미로운 작은 세부 사항이 많기 때문에 정리하고 싶습니다.

깊은 복사와 얕은 복사의 차이점

깊은 복사와 얕은 복사는 모두가 자주 듣는 두 가지 용어입니다. 둘의 차이점은 무엇인가요?

먼저 얕은 사본이 무엇인지 살펴보겠습니다.

var obj1 = { a: 1, b: 2 };
var obj2 = obj1;
obj2.a = 3;

console.log(obj1); // { a: 3, b: 2 }
console.log(obj2); // { a: 3, b: 2 }

obj1을 obj2에 할당하고 obj2의 해당 속성 값도 변경한 이유는 무엇입니까?

얕은 복사본은 실제로 참조의 복사본이므로 둘 다 여전히 메모리 에서 동일한 주소를 가리킵니다. 즉, obj1과 obj2는 실제로 동일한 객체를 가리킵니다. 예를 들어 1호실이 2호실로 바뀌었지만 이 방은 여전히 ​​같은 방인 것 같습니다.

Then 딥 카피는 두 개가 서로 다른 메모리 주소를 가리킨다는 의미이며, 이것이 진정한 카피 입니다. 위의 방을 예로 들어보겠습니다. 즉, 집 번호만 변경한 것이 아니라 실제로 새 방을 열었습니다.

Object.asset()에 대해 이야기

Object.sign()은 우리가 자주 사용하는 메소드입니다. 사실 이 메소드는 얕은 복사입니다. 하지만 여기에는 특별한 점이 있습니다. 즉, 첫 번째 레이어의 전체 복사본을 처리할 수 있다는 것입니다.

var obj1 = { a: 1, b: { c: 2 } };
var obj2 = Object.assign({}, obj1);
obj2.a = 3;
obj2.b.c = 3;
console.log(obj1); // { a: 1, b: { c: 3 } }
console.log(obj2); // { a: 3, b: { c: 3 } }

위의 예를 보면 a 속성의 값은 변경되지 않았지만 b 속성의 c 값은 변경되었습니다.

깊은 복사를 구현하는 데 일반적으로 사용되는 방법

JSON

이것은 깊은 복사를 구현하는 데 가장 일반적으로 사용되는 방법입니다. 예를 살펴보세요. #🎜🎜 #

var obj1 = { a: { b: 1 } };
var obj2 = JSON.parse(JSON.stringify(obj1));
이 방법은 매우 간단하고 사용하기 쉽지만 약간의 결함이 있습니다. 객체의 생성자를 삭제합니다. 즉, 깊은 복사 후에는 객체의 원래 생성자가 무엇이든 상관없이 깊은 복사 후에는 객체가 됩니다.

그리고 이 메서드가 올바르게 처리할 수 있는 유일한 개체는 숫자, 문자열, 부울 및 배열, 즉 JSON으로 직접 표현할 수 있는 데이터 구조입니다. RegExp 개체나 함수는 이런 방식으로 전체 복사될 수 없습니다.

lodash

이것이 제가 현재 사용하는 방법이며,

한 줄만 사용하면 됩니다. 게다가, lodash는 매우 강력한 라이브러리이며 제공되는 방법은 정말 게으른 사람들에게 꼭 필요한 것입니다.

위 내용은 js의 딥 카피와 얕은 카피에 대한 간략한 분석의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 segmentfault.com에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제