ホームページ >ウェブフロントエンド >jsチュートリアル >JS のディープ コピーとシャロー コピーの簡単な分析
この記事では、js のディープ コピーとシャロー コピーについて簡単に分析します。必要な方は参考にしていただければ幸いです。
ディープ コピーとシャロー コピーについては、実際には比較的基本的な 2 つの概念ですが、まだ非常に興味深い細かい詳細がたくさんあるため、整理したいと思います。
ディープ コピーとシャロー コピーは、誰もがよく聞く 2 つの用語であり、その違いは何でしょうか。
まずシャローコピーとは何かを見てみましょう。
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 に割り当て、それに応じて obj1 の対応する属性値も変更された、最も単純な例です。
浅いコピーは実際には参照の単なるコピーであるため、両方ともメモリ内の同じアドレスを指し続けます。つまり、obj1 と obj2 は実際には同じオブジェクトを指します。たとえば、家番号 1 が家番号 2 に置き換えられた部屋のようなものですが、この部屋はまだ同じ部屋です。
その後、ディープ コピーとは、2 つが異なるメモリ アドレスを指していることを意味し、これが真のコピー です。上の部屋を例に挙げると、単に番地を変更しただけではなく、実際に新しい部屋をオープンしたことになります。
Object.assign() は私たちがよく使うメソッドです。実際、このメソッドは浅いコピーです。しかし、これには特別な点があり、最初の層の深いコピーを処理できるということです。
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 の値は変更されています。
これはディープ コピーを実装するために最も一般的に使用される方法です。例を見てください:
var obj1 = { a: { b: 1 } }; var obj2 = JSON.parse(JSON.stringify(obj1));
This kind このメソッドはシンプルで使いやすいですが、オブジェクトのコンストラクターを破棄するという点で少し欠点があります。つまり、ディープ コピー後は、オブジェクトの元のコンストラクターが何であっても、ディープ コピー後はオブジェクトになります。
そして、このメソッドが正しく処理できる唯一のオブジェクトは、Number、String、Boolean、Array、つまり JSON で直接表現できるデータ構造です。 RegExp オブジェクトまたは関数をこの方法でディープ コピーすることはできません。
これは私が現在使用している方法です。var obj2 = _.cloneDeep(obj1)
という 1 行だけで実現できます。さらに、lodash は非常に強力なライブラリであり、提供されるメソッドは信頼性が高く、シンプルです。これは、怠け者にとっては本当に必需品です。
以上がJS のディープ コピーとシャロー コピーの簡単な分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。