JavaScript 中陣列的子集

1. 在 JavaScript 中使用 slice() 從陣列中提取陣列元素的子集
2. 在 JavaScript 中使用 splice() 從陣列中提取陣列元素的子集

陣列是程式語言的重要組成部分，因為它們包含許多有序元素。

所有這些專案都通過索引訪問。在 JavaScript 中，陣列是包含指定鍵（數字鍵）的值的常規物件。

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

陣列可以是一維的，也可以是多維的。JavaScript 陣列可以儲存任何東西，例如直接值或儲存 JavaScript 物件。

與其他語言不同，JS 陣列可以在同一陣列的不同索引處儲存不同的資料型別。我們將學習如何在 JavaScript 中提取陣列的一些元素或子集。

在 JavaScript 中使用 slice() 從陣列中提取陣列元素的子集

slice() 方法是 JavaScript 提供的內建方法。此方法在兩個位置切割陣列。

通過採用兩個輸入（開始索引和結束索引）來進行切割。並基於此，將返回索引之間的陣列部分。

如果只指定了起始索引，則返回到最後一個元素。使用 slice 而不是 splice 的優點是原始陣列是未變異，因為它在拼接中。

語法：

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

start 和 end 索引中的每個元素（包括開始元素和結束前的停止元素）都將插入到新陣列中。

結束索引完全是一個可選引數。有關詳細資訊，請參閱 slice() 方法文件。

const inputArray = [1, 2, 3, 4, 5];
const outputArray1 = inputArray.slice(0, 1);
const outputArray2 = inputArray.slice(1, 3);
const outputArray3 = inputArray.slice(-2);
console.log(outputArray1);
console.log(outputArray2);
console.log(outputArray3);

當我們呼叫 slice(0, 1) 時，元素 1 從初始陣列 inputArray 複製到 outputArray1。

如果起始索引大於陣列的長度，它將顯示為空，並且空陣列將作為輸出返回。

有趣的是，如果你指定負索引，則輸入引數被認為是從序列末尾的偏移量。在任何瀏覽器中執行上述程式碼後，它會列印出類似這樣的內容。

輸出：

[1]
[2, 3]
[4, 5]

在 JavaScript 中使用 splice() 從陣列中提取陣列元素的子集

splice() 方法影響或修改陣列的內容。這是通過刪除、替換現有專案並在其位置新增新專案來完成的。

語法：

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

JavaScript splice 方法接受三個輸入引數，其中第一個是 start。

必需引數指定陣列的起始位置/索引以修改陣列。如果大於陣列的長度，則將 start 設定為陣列的長度。

在這種情況下，不會刪除任何元素，但該方法的行為類似於加法函式，新增與提供的 [n*] 個元素一樣多的元素。

如果為負數，則從陣列末尾的那麼多元素開始。

第二個引數是 deleteCount，一個可選引數。此引數指定要從一開始就刪除的陣列元素的數量。

如果省略 deleteCount 或其值等於或大於 array.length - start，則刪除從陣列開頭到結尾的所有元素。

0 或負數，不刪除任何元素。在這種情況下，你至少需要輸入一個新專案。

第三個引數是 itemN...，一個可選引數。此引數指定要新增到陣列的元素，從開頭開始。

如果你不指定專案，splice() 只會消除陣列的元素。

此方法返回一個包含已刪除專案的替換陣列。如果只刪除 n 個元素，則返回一個包含 n 個元素的陣列。

如果沒有元素被刪除，則返回一個空陣列。有關詳細資訊，請參閱 splice 方法文件。

const fruitsArray = ['Kiwi', 'Orange', 'Apple', 'Banana'];
console.log(fruitsArray, fruitsArray.splice(0, 2));

在上面的示例中，我們指定了各種樣式的水果。提取柑橘類水果後，它將影響原始的 fruitsArray 陣列並返回一個陣列。

這不包含柑橘類水果的名稱。在任何瀏覽器中執行上述程式碼後，它會列印出類似這樣的內容。

輸出：

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

要檢查完整的工作程式碼，單擊此處。