es6 删除数组指定元素

浅浅的花香味﹌ 2022-04-04 02:55 314阅读 0赞

arr.splice(arr.findIndex(item => item.id === id), 1)
    //item 只是参数可以写成 i 或者 v 都可以 ， 
    //后面的额id是数组的id，是不能随便写的，如果你数组里面写的是id，这里就写id，如果数组里面写的是num，那这里就写num ， 
    //=== 后面的id是你想要删除的元素的id号，同理，如果你数组里面写的是num，那这里就是num号 ， 
    //1是你要删除1个元素的意思

###  第一种 splice(index,num);  ###

index代表的是数组元素的下标位置，num代表的是删除的个数

findIndex();   是找到某元素的下标的位置

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70][]  
如图，这个数组里面有三个元素，现在要删掉这个id是24的元素,那我们代码就应该这么写

arr.splice(arr.findIndex(item => item.id === 24), 1)

打印一下发现，id为24的元素就删掉啦 !

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 1][]

### 第二种 arr.filter() ###

filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。

**注意：** filter() 不会对空数组进行检测。

**注意：** filter() 不会改变原始数组。

array.filter(function(currentValue,index,arr), thisValue)

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 2][]![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 3][]

//这样就删除啦
    arr = arr.filter((num,index)=>{return index !== val})

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70]: /images/20220404/98c91dca6e094cdeb5bae2d8e7eedeca.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 1]: /images/20220404/c665784963c34116ba397db87061e434.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20210629113754903.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw==,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0hlcm9fcm9uZw_size_16_color_FFFFFF_t_70 3]: /images/20220404/e8b6c43c4d37416f8ea82880ee00cbbd.png