快捷導(dǎo)航

JS中splice添加或刪除數(shù)組元素

更新時(shí)間：2023年12月28日 15:30:57 作者：布丁吖

本文主要介紹了JS中splice添加或刪除數(shù)組元素,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧

語法

array.splice(index,howmany,item1,…,itemX)

參數(shù)說明

參數(shù)	描述
index	必需。規(guī)定從何處添加/刪除元素。該參數(shù)是開始插入和（或）刪除的數(shù)組元素的下標(biāo)，必須是數(shù)字。
howmany	可選。規(guī)定應(yīng)該刪除多少元素。必須是數(shù)字，但可以是 “0”。如果未規(guī)定此參數(shù)，則刪除從 index 開始到原數(shù)組結(jié)尾的所有元素。
item1,…,itemX	可選。要添加到數(shù)組的新元素

返回值說明

Type	描述
Array	如果從arrayObject中刪除了元素，則返回的是含有被刪除的元素的數(shù)組。

下標(biāo)問題

第一個(gè)參數(shù)index是數(shù)組的下標(biāo)，因?yàn)閕ndex是整數(shù)，整數(shù)包括正數(shù)、負(fù)數(shù)和0，所以就需要理解清楚正數(shù)的時(shí)候下標(biāo)是怎么排的，負(fù)數(shù)的時(shí)候下標(biāo)是怎么排的，這樣寫代碼的時(shí)候就不會迷糊了(不要問我為什么這么說??)。

在網(wǎng)上沒有找到相關(guān)資料說明splice的下標(biāo)是怎么搞得，沒辦法那就只能自己研究了，功夫不負(fù)有心人，經(jīng)過一番努力終于搞明白了??。

下標(biāo)排序方式如下：

在這里插入圖片描述

實(shí)戰(zhàn)

splice(index)

從index的位置開始，刪除之后的所有元素(包括第index個(gè))

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(1);
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相

在這里插入圖片描述

splice(index,howmany)

刪除從index位置開始的數(shù)，howmany為刪除的個(gè)數(shù)，當(dāng)howmany≤0時(shí)不會刪除任何元素。

示例一(howmany＞0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(1, 2);
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相：

在這里插入圖片描述

示例二(howmany ≤ 0)

howmany≤0就是不刪除howmany≤0就是不刪除howmany≤0就是不刪除

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(1, 0);
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

在這里插入圖片描述

splice(index,howmany,item1,…,itemX)

howmany ≤ 0

howmany≤0就是不刪除howmany≤0就是不刪除howmany≤0就是不刪除在index位置按順序依次添加item1,…,itemX

示例一(index ≥ 0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(1, 0, 'Grape', 'Pear');
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相

在這里插入圖片描述

示例二(index＜0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(-1, 0, 'Grape', 'Pear');
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相

在這里插入圖片描述

howmany＞0

先從index位置(包含index)開始刪除howmany個(gè)元素，然后在index位置按順序依次添加item1,…,itemX

示例一(index ≥ 0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(1, 1, 'Grape', 'Pear');
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相(藍(lán)框標(biāo)出的是添加的元素，橙框標(biāo)出的是刪除的元素)

在這里插入圖片描述

示例二(index＜0)

      let array = ['Banana', 'Orange', 'Apple', 'Mango']
      console.log('原數(shù)組：', array)
      let splice = array.splice(-2, 2, 'Grape', 'Pear');
      console.log('操作后數(shù)組：', array)
      console.log('變動(dòng)內(nèi)容', splice)

有圖有真相(藍(lán)框標(biāo)出的是添加的元素，橙框標(biāo)出的是刪除的元素)

在這里插入圖片描述