1. 程式人生 > 實用技巧 >js中slice()和splice()的區別

js中slice()和splice()的區別

寫在前面:

slice(): 該方法會 返回一個新的陣列,強調:新陣列,並不會影響原來的陣列

splice(): 該方法向陣列中新增/刪除元素,然後 返回被刪除的元素。會 改變原來的陣列。強調:會改變原來的陣列。

一、slice(start,end);

 ①:start表示從何處開始選取,end表示從何處開始結束選取,表示一個選取的範圍。start必需,end可選。

 ②:start可以為負數,此時它規定從陣列尾部開始算起的位置。也就是-1 ,指最後一個元素,-2 指倒數第二個元素,以此類推

 ③:end如果沒有被指定引數,陣列會包含從 start 到最後一個數組元素的所有元素

 ④:slice()方法不會修改陣列本身,而是返回所選取範圍的陣列元素。如果想刪除陣列中的某一個元素,需要使用splice()

下面來看一些例子

 這裡的取值範圍是0-2(start-end),因為陣列的下標是從0開始,所以這裡的2就是下面陣列中的 javascript元素

  •  這裡需要注意的是0-2選取的元素是html和css,並不包括javascript

  •  如果只有start,則會選擇start開始到end之間的所有陣列元素

  • 如果start是負數,則會從陣列尾部開始算起。這裡只有start沒有end,且start為負數,所以只能獲取到最後1個數組元素

  • 如果你想獲取除了最後1個元素以外的全部元素

  • 如果start和end都是負1,結果為空

二、splice()

splice()定義:

從陣列中新增或刪除元素,然後返回被刪除的陣列元素

splice()語法:arrayObject.splice(index,howmany,item1,.....,itemX)

①:index表示從什麼位置開始新增或刪除陣列元素

②:howmany表示刪除的元素數量,如果為0,則表示不刪除陣列元素

③:item1,.....,itemX表示新增的陣列元素

④:splice()方法會改變原始陣列

增加:
function add ()  {
  this.list.splice(index,0,newItem)
}
修改:
function update ()  {
  this.list.splice(index,1,newItem)
}
刪除:
function update () {   this.list.splice(index,1) }

下面來看一些例子

  • 從第3個元素(即 javascript)開始且不刪除元素,並在第3個元素前面新增1個元素hello

  • 從第3個元素開始且刪除1個元素(這裡刪除的元素是 javascript),並在原來第3個元素的位置新增1個元素hello

  • 從最後1個元素開始並刪除最後1個元素,同時在刪除的最後1個元素的位置新增1個元素hello

  • 從最後1個元素開始且不刪除元素,同時在最後1個元素前面新增1個元素hello