배열의 값 복사
P粉002546490
2023-08-20 12:42:44
<p>JavaScript에서 한 배열을 다른 배열로 복사하는 경우: </p>
<pre class="brush:php;toolbar:false;">var arr1 = ['a','b','c'];
var arr2 = arr1;
arr2.push('d'); // 이제 arr1 = ['a','b','c','d']</pre>
<p><code>arr2</code>가 새로운 독립 배열이 아니라 <code>arr1</code>와 동일한 배열을 참조하고 있다는 것을 깨달았습니다. 두 개의 개별 어레이를 얻기 위해 어레이를 어떻게 복사합니까? </p>
Javascript에서 전체 복사 기술은 배열의 요소에 따라 다릅니다. 여기서 시작해 보겠습니다.
세 가지 유형의 요소
요소는 리터럴 값, 리터럴 구조 또는 프로토타입일 수 있습니다.
으아악이러한 요소에서 세 가지 유형의 배열을 만들 수 있습니다.
으아악Deep Copy 기술은 이 세 가지 어레이 유형에 따라 달라집니다
배열의 요소 유형에 따라 다양한 기술을 사용하여 전체 복사를 수행할 수 있습니다.
딥 카피 기술
벤치마크
https://www.measurethat.net/Benchmarks/Show/17502/0/deep-copy-comparison
리터럴 배열(유형 1)
[ ...myArray ]
、myArray.splice(0)
、myArray.slice()
和myArray.concat()
技术来深拷贝只包含字面值(布尔值、数字和字符串)的数组;其中在Chrome中,slice()
的性能最高,在Firefox中,扩展运算符...
를 사용하면 최대 성능을 얻을 수 있습니다.리터럴 값 배열(유형 1) 및 리터럴 구조 배열(유형 2)
JSON.parse(JSON.stringify(myArray))
기술을 사용하여 리터럴 값(부울 값, 숫자, 문자열) 및 리터럴 구조(배열, 개체)를 심층 복사할 수 있지만 프로토타입 개체는 복사할 수 없습니다.모든 배열(유형 1, 유형 2, 유형 3)
cloneDeep(myArray)
또는 jQuerycloneDeep(myArray)
或 jQuery 的extend(true, [], myArray)
技术来深拷贝所有类型的数组。其中Lodash的cloneDeep()
의extend를 사용할 수 있습니다. (true, [], myArray)
모든 유형의 배열을 심층 복사하는 기술입니다. 그 중 Lodash의cloneDeep()
기술이 가장 성능이 좋습니다.cloneDeep()
,但高于extend(true)
보다 성능이 낮은 모든 유형의 배열을 딥 복사할 수 있습니다.이 질문에 대답하려면...
질문
으아악답변
왜냐하면
으아악arr1
是一个包含字面值(布尔值、数字或字符串)的数组,你可以使用上面讨论的任何深拷贝技术,其中slice()
和扩展运算符...
가 가장 성능이 좋거든요.사용 방법: