Javascript Array.slice()和Array.splice()的區別用法及代碼示例

JavaScript 數組是一種可以保存多個值的變量。有許多與這些數組相關的方法。方法slice() 和splice() 是廣泛使用的數組操作方法。它們之間存在各種差異，如下表所示。

slice()	splice()
此方法用於通過選擇給定數組的sub-array來獲取新數組。	此方法用於從給定數組中添加/刪除項目。
參數‘s’表示起始索引和‘e’表示結束索引。它們表示要獲取的sub-array的索引。默認情況下，開始值為‘0’，結束值為‘n’。	參數‘i’表示起始索引，‘n’表示要從指定起始索引中刪除的項目數。‘第 1 項，第 2 項，……第 n 項’表示要在給定索引處添加的新項目的列表。如果n=0，則不刪除任何項目，新項目僅添加到指定的起始索引。
這些更改不會反映在原始數組中。	更改反映在原始數組中
結果必須分配給一個新的數組變量。	結果不需要分配給任何其他新變量。
返回值是新數組，其中包含給定數組的選定 sub-array 中的值。將選擇從 start 到 (end-1) 範圍內的值。	返回值是一個包含被刪除元素的數組。
正好有 2 個參數	接受 ‘n’ 個參數(可以提供新項目列表)

用法:

slice():
```
array_name.slice(s, e)
```

splice():

array_name.splice(i, n, item 1, item 2, .....item n)

slice()方法示例
示例 1：開始和結束均已指定。


<script> 
    var cars=['Benz', 'Innova', 'Breeza', 'Etios', 'Dzire']; 
    var new_cars=cars.slice(1, 4); 
    document.write("cars :", cars, "<br><br>"); 
     document.write("new_cars :", new_cars); 
</script>

輸出：

cars :Benz, Innova, Breeza, Etios, Dzire
new_cars :Innova, Breeza, Etios

示例 2：僅指定開始。默認情況下，末尾是數組的長度。


<script> 
    var cars=['Benz', 'Innova', 'Breeza', 'Etios', 'Dzire']; 
    var new_cars=cars.slice(2); 
    document.write("cars :", cars, "<br><br>"); 
    document.write("new_cars :", new_cars); 
</script>

輸出：

cars :Benz, Innova, Breeza, Etios, Dzire

new_cars :Breeza, Etios, Dzire

splice()方法示例
示例 1：現在讓我們添加更多項目但不刪除任何項目。


<script> 
    var cars=['Benz', 'Innova', 'Breeza', 'Etios', 'Dzire']; 
    cars.splice(2, 0, 'ambassedor', 'BMW', 'Audi'); 
    document.write("cars :", cars, "<br><br>"); 
</script>

輸出：

cars :Benz, Innova, ambassedor, BMW, Audi, Breeza, Etios, Dzire

示例 2：刪除一個元素並且不添加任何新項目


<script> 
    var cars=[ 
'Benz', 'Innova', 'ambassedor', 'BMW', 'Audi', 'Breeza', 'Etios', 'Dzire']; 
    cars.splice(2, 1); 
    document.write("cars :", cars, "<br><br>"); 
</script>

輸出：

cars :Benz, Innova, BMW, Audi, Breeza, Etios, Dzire

示例 3：刪除多個元素並且不添加任何新項目。


<script> 
    var cars=[ 
'Benz', 'Innova', 'ambassedor', 'BMW', 'Audi', 'Breeza', 'Etios', 'Dzire']; 
    cars.splice(2, 3); 
    document.write("cars :", cars, "<br><br>"); 
</script>

輸出：

cars :Benz, Innova, Breeza, Etios, Dzire

在刪除多個元素時，在上述情況下，指定的起始索引是‘2’，並且需要刪除“3個元素”，因此它開始從索引本身刪除元素。因此，索引 2、3 和 4 中的項目被刪除。

相關用法

注：本文由純淨天空篩選整理自erakshaya485大神的英文原創作品 What is the difference between Array.slice() and Array.splice() in JavaScript ?。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。