Javascript 複製數組

| | | | | | | | | | | | | | | | | | | | | |

JavaScript 中,複製數組並不像使用賦值運算符 (=) 創建副本那麼容易。如果您以前嘗試過,您會驚訝地發現它只鏈接到原始列表。有什麼問題?

在本指南中,我們將解釋如何復制 JavaScript 數組。我們將查看三種 JavaScript 數組複製策略的代碼,以便您開始復制數組。

複製 JavaScript 數組的問題

在某種程度上," = & Rdquo; 運算符在一個新的 變量 中創建一個 數組 的副本。但是,這更像是一個指針而不是副本。這是因為“=”運算符創建對原始數組的引用。它不會創建現有表的副本。

讓我們嘗試使用 賦值運算符 創建數組的副本,無需任何其他代碼:

Our代碼返回:

我t 似乎我們的表已被複製。 “Fruit” 包含我們的“berries”數組中的所有值,Äã,Äã。

現在讓我們嘗試向“fruits”數組文件夾中添加一個元素:

我們在水果系列中加入了“甜瓜”。接下來,我們將“水果”和“漿果”的值“Äã”打印到控制台:

“fruits”和“berries”都包含相同的值。這是因為從技術上講,我們還沒有克隆我們的海灣。我們剛剛創建了一個對此的引用。

每次我們操作“berries”數組時,都會在“fruits”數組的字段中進行更改。

如何復制 JavaScript 數組

賦值運算符不復制數組。我們必須使用另一種方法。幸運的是,有很多方法可以復制一幅畫。三種主要方法是:

讓我們一一討論。

使用擴展運算符

擴展運算符是 JavaScript ES6 中引入的一個特性。它提供從 . 可迭代的內容訪問該運算符通常用於製作數組的淺表副本

運算符展開具有三個點作為橢圓 (& hellip;)。讓我們從之前創建“漿果”數組的副本:

我們使用擴展運算符來創建數組的副本。我們檢查數組 t o 確保它們是正確的:

我們的代碼返回:

價值“ Melon " 只被添加到了 "fruits" 載體中。實際上,我們使用廣播運算符創建了一個重複的向量 "berries" 。現在表 "fruit" 是它自己的表。他的值由表 "berry" 分隔.

使用循環

事實證明,使用for循環是創建繪畫副本的好方法。

這方法可能不適合作為傳播運算符,因為它需要多行代碼。但是,for 循環確實複製了一個對象。

我們已經聲明了兩個列表:berries 和 fruits。Fruits 最初是一個空列表。我們因此使用了 for 循環來遍歷 l 的所有元素iste "berries" 。對於列表中的每一項,其值都會復製到 "fruit" 數組文件夾中。

讓我們運行我們的測試看看我們的數組是否分開:

我們的代碼返回:

成功! “Berries”和“fruit”是兩個單獨的表。

使用Array.from()

方法Array.from () 將任何可迭代對像變成一個數組。通過一個可迭代對象的每個元素並將其添加到一個新數組中。這意味著它可以用來複製一個數組。

讓我們再次創建我們的“berries”數組的副本:

這種解決方案和展開運算符的語法一樣,只需要兩行代碼,它是一種高效且複製表格的簡潔方法。現在讓我們運行一個測試來檢查我們的新數組:

我們的代碼返回:

我們的表格已經復製成功了。

結論

如果您知道如何在 JavaScript 中復制數組,則很容易。

如果您想創建一個單獨版本的數組。這是因為賦值運算符創建了一個指向現有數組的指針;不會創建新表。

您可以使用展開運算符、for 循環或 Array.from () 方法創建數組的副本。您現在可以像專家一樣用 JavaScript 複製表格了。