js数组中的splice的用法和slice,concat自定义删除数组元素方法

124 阅读2分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第12天,点击查看活动详情

一 、splice(删除元素的索引,删除的个数,增加的元素)

1. 大家都知道数组有一个 splice 方法可以对数组中的元素进行删除的操作,就像这样:删除数组中的数字 3

**

let arr = [0,1,2,3,4,5];
// 删除数组种索引为 3的元素
let newArr = arr.splice(3,1) 返回的是被删除的元素组成的新数组,会改变原数组

image.png

\

此时的 arr 数组为

\

image.png

2. 并且 splice 也可以用来改变数组中的元素(先删除元素再改变这个位置的元素)

**

var arr = [0,1,2,3,4,5]
var letArr = arr.splice(3,1,6) // 将数组中的第三位元素变为6

image.png

3. 使用 splice 在数组中增加一个元素

**

var arr = [0,1,2,3,4,5]
var letArr = arr.splice(3,0,6) // 在数组中的第三位元素前面加上  6 
// tips:删除索引为 3,但删除的个数为 0 ,增加的元素为6

tips:是在你要删除元素索引前面加上你要删除的元素

\

image.png

二、自定义删除元素方法使用slice和concat为数组增加一个删除方法

上面 splice方法 返回值为删除的元素组成的新数组,而我们希望直接删除元素并且返回原数组删除后的数组怎么办?下面我来介绍一种方法

**

Array.prototype.delArr = function( n ) { // 删除数组中的元素个数
// prototype 为在数组原型上添加一个delArr方法
 // n<0 则直接返回
if(n<0){
return this
}else{
return this.slice(0,n).concat(this.slice(n+1,this.length))
}
}
// 下面测试一下这个方法可不可行
var arr = [0,1,2,3,4,5];
console.log(arr.delArr(3))。// 输出[0,1,2,4,5]

tips1: slice (begin,end):

  1. 这是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。原始数组不会被改变。\
  2. 如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。
  3. 只写一个参数,表示从这个开始截取到最后一个\
> tips2:concat方法:返回一个新数组,这个新数组是由两个或更多数组组合而成的。\
这里就是返回this.slice(0,n)---this.slice(n+1,this.length)组成的新数组,这中间,刚好少了第n项。