配列の値をコピーする
P粉002546490
2023-08-20 12:42:44
<p>JavaScript で 1 つの配列を別の配列にコピーする場合: </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> と同じ配列を参照していることに気付きました。配列をコピーして 2 つの別々の配列を取得するにはどうすればよいですか? </p>
JavaScript では、ディープ コピー テクノロジは配列内の要素に依存します。ここから始めましょう。
3種類の要素
要素には、リテラル値、リテラル構造、またはプロトタイプを指定できます。
リーリーこれらの要素から、3 種類の配列を作成できます。
リーリーディープ コピー テクノロジは、これら 3 つの配列タイプに依存します
配列内の要素のタイプに応じて、さまざまな手法を使用してディープ コピーを実行できます。
ディープコピーテクノロジー
ベンチマーク
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)
Lo-dash- の cloneDeep(myArray) または
よりも低いパフォーマンスですが、- extend(true )# よりも高いパフォーマンスで、すべての種類の配列をディープ コピーできます。 ##。
リーリー それでは、この質問に答えてください...
###質問### リーリー ###答え###jQuery
の extend(true, [], myArray)# を使用できます。 ## テクノロジー すべてのタイプの配列をディープ コピーします。その中でも、Lodash の cloneDeep()は技術的なパフォーマンスが最も優れています。
サードパーティ ライブラリの使用を避けている人のために、次のカスタム関数は、
cloneDeep()はリテラル (ブール値、数値、または文字列) を含む配列であるため、上記で説明したディープ コピー手法のいずれかを使用できます。演算子 #....
は最高のパフォーマンスを発揮します。リーリー
###これを使って:###
リーリー