了解 JavaScript 中的深拷貝

JavaScript 不需要介紹，它是一種強大的語言，具有許多多功能性，但如果您使用過它，您可能已經注意到一些不尋常的行為。其中之一是 JavaScript 如何處理變數副本，特別是在處理物件時。在本文中，我們將探討深複製的概念以及它如何幫助我們在程式中複製資料時避免意外問題。

當我們複製變數時，JavaScript 會建立一個新的記憶體空間並將複製的值儲存在那裡；那麼新的變數就指向這個新的記憶體空間。例如：

x = 5;
y = x;

y 指向一個新的記憶體空間，其值與 x 相同，即視覺上的 5 。會是這樣的：

上述概念僅適用於原始值，且對物件則不同。想像一下我們有以下兩個物件：

let a = {
    name: 'Rick',
    lastName: 'Sanchez',
};

let b = a;

在上面的例子中，b並沒有像我們想像的那樣擁有自己的內存空間；相反，a指向儲存a 的記憶體空間。

這種行為會導致什麼問題？基本上，如果您更改 a 或 b 中的任何字段，則兩個變數都會更改。運行以下程式碼並自行驗證。

let a = {
    name: 'Rick',
    lastName: 'Sanchez',
};

let b = a;

b.name = 'Morty';

console.log('a: ', a); // a:  { name: 'Morty', lastName: 'Sanchez' }
console.log('b: ', b); // b:  { name: 'Morty', lastName: 'Sanchez' }

這個問題的解決方案？我們需要進行深拷貝，將a的值保存到b指向的新的獨立記憶體空間

const b = JSON.parse(JSON.stringify(a));

透過這種方式，我們透過將格式從 Object 變更為 JSON 來強制 JavaScript 建立新的記憶體空間。這是使用 stringify 方法完成的，然後使用 parse 方法將具有自己記憶體空間的 JSON 轉換回對象，因此兩個變數保持完全獨立。

這種奇怪的行為發生在你身上嗎？請在評論中告訴我，我很樂意閱讀您的文章！

以上是了解 JavaScript 中的深拷貝的詳細內容。更多資訊請關注PHP中文網其他相關文章！