JavaScript でオブジェクトを操作する場(chǎng)合、オブジェクト參照 と オブジェクトのコピー の違いを理解することが重要です。詳細(xì)な概要は次のとおりです:

オブジェクト參照

1. オブジェクトは參照型です:
   • オブジェクトを変數(shù)に割り當(dāng)てると、オブジェクト自體のコピーではなく、オブジェクトが保存されているメモリの場(chǎng)所への參照が割り當(dāng)てられることになります。
   • 1 つの參照を通じてオブジェクトを変更すると、同じオブジェクトへのすべての參照に影響します。

   let obj1 = { name: "Alice" };
   let obj2 = obj1; // obj2 now references the same object as obj1
   obj2.name = "Bob";
   console.log(obj1.name); // Output: "Bob"

1. 等価性チェック:
   • 2 つの変數(shù)は、內(nèi)容が同一である場(chǎng)合ではなく、メモリ內(nèi)の同じオブジェクトを參照する場(chǎng)合に等しいと見(jiàn)なされます。

   let a = { key: "value" };
   let b = { key: "value" };
   console.log(a === b); // Output: false (different references)
   let c = a;
   console.log(a === c); // Output: true (same reference)

オブジェクトのコピー

オブジェクトのコピーには、淺いコピーと深いコピーの 2 つの主なタイプがあります。

1.淺いコピー

• 淺いコピーでは新しいオブジェクトが作成されますが、最初のレベルのプロパティのみがコピーされます。ネストされたオブジェクトまたは配列は、複製されずに引き続き參照されます。

淺いコピーのテクニック:

• Object.assign():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = Object.assign({}, original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• 拡散演算子 (...):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = { ...original };
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• どちらのメソッドも淺いコピーを作成します。つまり、ネストされたオブジェクトは引き続きリンクされます。

2.ディープコピー

• ディープ コピーは、ネストされた構(gòu)造を含むオブジェクト全體を複製します。新しいオブジェクトは元のオブジェクトから完全に獨(dú)立しています。

ディープコピーのテクニック:

• JSON.parse() および JSON.stringify():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = JSON.parse(JSON.stringify(original));
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • 制限事項(xiàng): このメソッドは、関數(shù)、未定義、Infinity、または Date や RegExp などの特殊なオブジェクトを処理しません。

• StructuredClone() (モダン JavaScript):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = structuredClone(original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • このメソッドは、ほとんどのエッジケース (循環(huán)參照など) を処理しますが、古い環(huán)境ではサポートされていません。

• カスタム ライブラリ:

  • lodash のようなライブラリを使用します。

     let obj1 = { name: "Alice" };
     let obj2 = obj1; // obj2 now references the same object as obj1
     obj2.name = "Bob";
     console.log(obj1.name); // Output: "Bob"
  

概要表

以上がJavaScript オブジェクトの參照とコピーを理解する - 簡(jiǎn)単な説明の詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國(guó)語(yǔ) Web サイトの他の関連記事を參照してください。