js 的删除方法和 filter的过滤删除方法对比

先说一下原生的js的删除方法

1:js中的splice方法

　　splice(index,len,[item])    注释：该方法会改变原始数组。

splice有3个参数，它也可以用来替换/删除/添加数组内某一个或者几个值

index:数组开始下标        len: 替换/删除的长度       item:替换的值，删除操作的话 item为空

如：a=[{'a':1},{'a':2},{'a':3},{'a':4},{'a':5},{'a':1}];

因为splice删除后数组的长度会变化，下标也就跟着变化，相邻的两个数据就会跳过原下标的3的位置导致删除不掉{'a':4}；

js的filter过滤方法可以解决这一问题

删除 ----  item不设置

arr.splice(1,1)   //['a','c','d']         删除起始下标为1，长度为1的一个值，len设置的1，如果为0，则数组不变

arr.splice(1,2)  //['a','d']          删除起始下标为1，长度为2的一个值，len设置的2

替换 ---- item为替换的值

arr.splice(1,1,'ttt')        //['a','ttt','c','d']         替换起始下标为1，长度为1的一个值为‘ttt’，len设置的1

arr.splice(1,2,'ttt')        //['a','ttt','d']         替换起始下标为1，长度为2的两个值为‘ttt’，len设置的1

 

添加 ----  len设置为0，item为添加的值

arr.splice(1,0,'ttt')        //['a','ttt','b','c','d']         表示在下标为1处添加一项‘ttt’

看来还是splice最方便啦

2：delete       delete删除掉数组中的元素后，会把该下标出的值置为undefined,数组的长度不会变

如：delete arr[1]  //['a', ,'c','d']     中间出现两个逗号，数组长度不变，有一项为undefined

在看一下vue的filter的过滤返回方法

直接返回合法的数据就不用使用js的删除方法简便快捷

这个是根据我之前分享的多层复选框数组改编的》》，在原有的数据上加了个info参数！

再看等价于删除方法的filter，del过滤函数

有什么好的建议欢迎在评论区评论