JavaScript 中的淺複製與深複製

使用 JavaScript 時，了解淺複製和深複製之間的差異對於有效操作物件和陣列至關重要。讓我們深入研究這些術語的含義以及如何在程式碼中實現每種類型的副本。

淺複製
淺拷貝會建立一個新的物件或數組，其中包含與原始物件或陣列相同的值。但是，如果原始檔案包含嵌套物件或數組，則淺拷貝僅複製對這些嵌套結構的引用，而不複製結構本身。這意味著對複製結構中嵌套物件或陣列的變更也會影響原始結構。

淺複製方法範例：

1. 擴充運算子 ({...})

const original = { a: 1, b: { c: 2 } };
const shallowCopy = { ...original };

這裡，shallowCopy是一個新對象，但shallowCopy.b仍然引用與original.b相同的對象。

2.Object.assign()

const shallowCopy = Object.assign({}, original);

1. 數組切片方法

const originalArray = [1, 2, 3];
const shallowCopyArray = originalArray.slice();

深複製
深層複製會建立一個新的物件或陣列，它是原始物件或陣列的完整、獨立的克隆，包括所有嵌套的物件和陣列。深層副本的變更不會影響原始副本，反之亦然。

深度複製方法範例：

1. JSON.stringify() 和 JSON.parse()

const original = { a: 1, b: { c: 2 } };
const deepCopy = JSON.parse(JSON.stringify(original));

此方法將物件序列化為 JSON 字串，然後將其解析回新物件。但是，它不處理函數、未定義或循環參考。

2.遞迴函數

function deepCopy(obj) {
  if (obj === null || typeof obj !== 'object') return obj;

  const copy = Array.isArray(obj) ? [] : {};
  for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
      copy[key] = deepCopy(obj[key]);
    }
  }
  return copy;
}

1. StructuredClone()（在現代 JavaScript 環境中）

const deepCopy = structuredClone(original);

何時使用每個

• 淺拷貝：適合沒有巢狀結構的簡單物件或陣列。它更快並且使用更少的記憶體。當您需要快速複製時使用它，其中對嵌套物件的變更應反映在原始和副本中。

• 深度複製：對於具有巢狀結構的複雜物件或陣列是必需的。它確保對副本的更改不會影響原始版本。當你需要完全獨立的克隆時使用它。

了解這些差異有助於防止意外共享引用引起的錯誤，並確保應用程式中的資料完整性

以上是JavaScript 中的淺複製與深複製的詳細內容。更多資訊請關注PHP中文網其他相關文章！