如何正確複製 JavaScript 物件、處理不同的資料類型和潛在的陷阱？

正確複製 JavaScript 物件：綜合指南

複製 JavaScript 物件需要採用細緻入微的方法來防止原始物件發生意外修改。本文剖析了物件克隆的複雜性並提出了可靠的解決方案。

複製內建物件的挑戰

嘗試複製內建 JavaScript 物件（例如，日期、字串）可能會導致與預期行為的偏差。例如，克隆 Date 物件可能會導致原始物件和克隆物件之間存在時間差。

通用深度複製函數

全面的克隆函數必須考慮適用於各種物件類型和隱藏屬性。以下是解決這些問題的範例：

function clone(obj) {
  var copy;

  // Handle simple types and null/undefined
  if (null == obj || typeof obj != "object") return obj;

  // Handle Dates
  if (obj instanceof Date) {
    copy = new Date();
    copy.setTime(obj.getTime());
    return copy;
  }

  // Handle Arrays
  if (obj instanceof Array) {
    copy = [];
    for (var i = 0, len = obj.length; i < len; i++) { copy[i] = clone(obj[i]); }
    return copy;
  }

  // Handle Objects
  if (obj instanceof Object) {
    copy = {};
    for (var attr in obj) {
      if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
    }
    return copy;
  }

  throw new Error("Unable to copy obj! Its type isn't supported.");
}

限制和注意事項

此函數適用於簡單類型、樹結構資料和沒有循環的物件參考。然而，它在處理複雜物件時有局限性，包括：

• 循環引用：該函數不處理循環引用，這可能導致堆疊溢位。
• 隱藏屬性：屬性無法透過物件迭代存取的物件（例如 __proto__）可能無法被複製。
• 原型繼承：使用自訂原型克隆物件將無法正確保留原型。

現代結構化克隆

ES2019 引入了結構化克隆，它提供了一種更可靠、更有效率的方式來克隆對象，包括循環引用。但是，並非所有瀏覽器都支援它。

以上是如何正確複製 JavaScript 物件、處理不同的資料類型和潛在的陷阱？的詳細內容。更多資訊請關注PHP中文網其他相關文章！