在 JavaScript 中複製陣列

Shraddha Paghdar 2023年1月30日 2022年5月10日
  1. 在 JavaScript 中使用 slice() 從陣列中複製陣列元素
  2. 在 JavaScript 中使用 Spread ... 運算子從陣列中複製陣列元素
在 JavaScript 中複製陣列

在本文中,我們將學習如何將陣列的元素複製到新的 JavaScript 陣列中。

在 JavaScript 中,陣列是包含所需鍵中的值的普通物件,可以是數字。

陣列是具有固定數字鍵和動態值的 JavaScript 物件,在單個變數中包含任意數量的資料。陣列是一維或多維的。

JavaScript 陣列可以儲存任何東西,例如直接值或儲存 JavaScript 物件。與不同的語言相比,JavaScript 陣列可以在相同陣列的不同索引上儲存不同的資料。

在 JavaScript 中使用 slice() 從陣列中複製陣列元素

slice() 方法是 JavaScript 提供的內建方法。此方法將陣列拆分為兩個位置。

通過採用兩個輸入(開始索引和結束索引)來執行此切割。基於此,該部分將在索引上返回一個陣列。

如果只指定起始索引,則返回最後一個元素。使用 slice 而不是 splice 的優點是它不會用 splice 改變原始陣列。

語法:

slice()
slice(start)
slice(start, end)

startend 索引處的任何元素(包括 end 之前的 start 和 stop 元素)都將插入到新陣列中。結束索引是一個完全可選的引數。

你可以在 slice() 的文件中找到有關 slice 函式的更多資訊。

const inputArray = ["Kiwi","Orange","Apple","Banana"];
const outputArray1 = inputArray.slice();
console.log(outputArray1);

當我們呼叫 slice() 時,所有元素都從原始陣列複製,即 inputArrayoutputArray1。整個陣列被複制,因為我們不傳遞開始或結束索引。

如果起始索引大於陣列的長度,則返回空,空陣列也將作為輸出返回。有趣的部分是,如果你指定負索引,輸入引數將被視為從序列末尾開始的更改。

一旦你在任何瀏覽器中執行上面的程式碼,它就會列印出類似這樣的內容。

輸出:

["Kiwi","Orange","Apple","Banana"]

在 JavaScript 中使用 Spread ... 運算子從陣列中複製陣列元素

spread (...) 語法允許擴充套件可迭代物件,例如,期望零個或多個引數(用於函式呼叫)或元素(用於陣列字面量)的表示式或陣列或擴充套件物件在需要零個或多個鍵值對的地方表達(對於物件文字)。

語法:

const newArray = [...oldArray];

當物件或陣列的所有元素必須包含在某個列表中時,可以使用 spread 語法。

它通常用於將新專案新增到本地資料儲存或檢視所有已儲存的專案和新增內容。此類操作的一個非常簡單的版本可能如下所示。

const inputArray = ["Kiwi","Orange","Apple","Banana"];
const outputArray1 = [...inputArray, 'Grapes'];
console.log(outputArray1);

在上面的示例中,你可以儘可能多地執行最後一行,以將更多葡萄新增到陣列的末尾。

輸出:

["Kiwi","Orange","Apple","Banana"]
["Kiwi","Orange","Apple","Banana", "Grapes"]
Shraddha Paghdar avatar Shraddha Paghdar avatar

Shraddha is a JavaScript nerd that utilises it for everything from experimenting to assisting individuals and businesses with day-to-day operations and business growth. She is a writer, chef, and computer programmer. As a senior MEAN/MERN stack developer and project manager with more than 4 years of experience in this sector, she now handles multiple projects. She has been producing technical writing for at least a year and a half. She enjoys coming up with fresh, innovative ideas.

LinkedIn

相關文章 - JavaScript Array