在 JavaScript 中使用對象時，理解 對象引用 和 對象復(fù)制 之間的區(qū)別至關(guān)重要。以下是詳細概述：

對象引用

1. 對象是引用類型：
   • 將對象分配給變量時，您分配的是對存儲該對象的內(nèi)存位置的引用，而不是對象本身的副本。
   • 通過一個引用修改對象會影響對同一對象的所有引用。

   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. 平等檢查：
   • 如果兩個變量引用內(nèi)存中的同一對象，則它們相等，而不是它們的內(nèi)容相同。

   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)

對象復(fù)制

對象復(fù)制主要有兩種類型：淺復(fù)制和深復(fù)制。

1.淺拷貝

• 淺拷貝創(chuàng)建一個新對象，但它只復(fù)制第一層屬性。嵌套對象或數(shù)組仍然被引用，而不是重復(fù)。

淺復(fù)制技術(shù):

• 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)
  

• 這兩種方法都會創(chuàng)建淺表副本，這意味著嵌套對象仍然是鏈接的。

2.深度復(fù)制

• 深層復(fù)制復(fù)制整個對象，包括嵌套結(jié)構(gòu)。新對象完全獨立于原始對象。

深度復(fù)制技術(shù):

• 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
  

  • 限制：此方法不處理函數(shù)、未定義、Infinity 或特殊對象（如 Date 或 RegExp）。

• StructuredClone()（現(xiàn)代 JavaScript）：
  

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

  • 此方法可以處理大多數(shù)邊緣情況（例如循環(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 對象引用和復(fù)制 - 簡要說明的詳細內(nèi)容。更多信息請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！