浅谈js数组splice删除某个元素爬坑


Posted in Javascript onOctober 14, 2020

先来看下几个概念:

// splice:返回从原始数组中删除的项(如果没有任何删除,则返回空数组)
    // 当指定2个参数时,表示删除
    // 当指定3个参数,且第2个参数为0时表示插入
    // 当指定3个参数,且第2个参数为1时表示替换

本次就拿删除举例,本身我们想删除数组中的某个指定元素,我们需要知道它所在数组中的下标,我们可以用 数组.indexOf获取它所在的下标,然后拿splice删除这个元素。

本身是没问题

代码如下:

var arr = ["张三","李四","王五","赵六"];

// 删除王五
arr.splice(arr.indexOf("王五"),1);

但是。。。。。问题就来了。

如果放到for循环中,比如循环数组,当某个条件成立的时候,我们需要删除某个指定的元素。

但是循环中,i每次都是+1的,但是我们删除某个元素后,下标就变了,相应的位置发生变化,i的值加一后,就会跳过下一个元素。

坑啊。。。

所以,在删除某个元素的时候,我们手动把 i的值再减一,这样就会避免出现跳过某个元素的问题。

例如:循环数组,当 DasOperation  属性值等于 没变 的时候,从数组中删除这条数据,然后i-1

// 删除没有变化的,不传递到后台
for (let i = 0; i < this.CurrJobData.Content.length; i += 1) {
  if (this.CurrJobData.Content[i].DasOperation === '没变') {
    this.CurrJobData.Content.splice(this.CurrJobData.Content.indexOf(this.CurrJobData.Content[i]), 1);
    i -= 1;// 必须对i减去1,否则后面的一个元素会被跳过去
  }
}

好了,为避免更多小伙伴遇坑,贴出来,希望有帮助。

 到此这篇关于浅谈js数组splice删除某个元素爬坑的文章就介绍到这了,更多相关js splice删除某个元素内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
encode脚本和normal脚本混用的问题与解决方法
Mar 08 Javascript
Document:getElementsByName()使用方法及示例
Oct 28 Javascript
jquery uploadify 在FF下无效的解决办法
Sep 26 Javascript
jquery实现鼠标滑过显示提示框的方法
Feb 05 Javascript
js实现随屏幕滚动的带缓冲效果的右下角广告代码
Sep 04 Javascript
JQuery解析XML数据的几个简单实例
May 18 Javascript
第一次动手实现bootstrap table分页效果
Sep 22 Javascript
react-native动态切换tab组件的方法
Jul 07 Javascript
ES6 系列之 Generator 的自动执行的方法示例
Oct 19 Javascript
vue实现移动端悬浮窗效果
Dec 01 Javascript
原生JS实现的跳一跳小游戏完整实例
Jan 27 Javascript
基于Vue插入视频的2种方法小结
Apr 02 Javascript
如何使用JS console.log()技巧提高工作效率
Oct 14 #Javascript
JavaScript Blob对象原理及用法详解
Oct 14 #Javascript
基于javascript原生判断DOM是否加载完毕
Oct 14 #Javascript
JavaScript常用进制转换及位运算实例解析
Oct 14 #Javascript
Vue实现鼠标经过文字显示悬浮框效果的示例代码
Oct 14 #Javascript
JavaScript本地储存:localStorage、sessionStorage、cookie的使用
Oct 13 #Javascript
原生JS实现相邻月份日历
Oct 13 #Javascript
You might like
PHP使用Mysql事务实例解析
2014/09/08 PHP
php操作mongoDB实例分析
2014/12/29 PHP
php-fpm中max_children的配置
2019/03/15 PHP
jQuery textarea的长度进行验证
2009/05/06 Javascript
加载jQuery后$冲突的解决办法
2010/07/09 Javascript
THREE.JS入门教程(6)创建自己的全景图实现步骤
2013/01/25 Javascript
jquery实现导航固定顶部的效果仿蘑菇街
2014/10/22 Javascript
JavaScript实现给按钮加上双重动作的方法
2015/08/14 Javascript
JS实现选项卡实例详解
2015/11/17 Javascript
javascript自动恢复文本框点击清除后的默认文本
2016/01/12 Javascript
Vue+axios 实现http拦截及路由拦截实例
2017/04/25 Javascript
详解Node.js 命令行程序开发教程
2017/06/07 Javascript
详解Vue2 SSR 缓存 Api 数据
2017/11/20 Javascript
vue.js整合mint-ui里的轮播图实例代码
2017/12/27 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
2018/06/05 jQuery
Python3实现连接SQLite数据库的方法
2014/08/23 Python
python操作mysql中文显示乱码的解决方法
2014/10/11 Python
Windows系统下安装Python的SSH模块教程
2015/02/05 Python
Python实现的堆排序算法原理与用法实例分析
2017/11/22 Python
Tensorflow 利用tf.contrib.learn建立输入函数的方法
2018/02/08 Python
解决Pandas to_json()中文乱码,转化为json数组的问题
2018/05/10 Python
python使用循环打印所有三位数水仙花数的实例
2018/11/13 Python
Python中的random.uniform()函数教程与实例解析
2019/03/02 Python
python字符串中匹配数字的正则表达式
2019/07/03 Python
详解Python3 pandas.merge用法
2019/09/05 Python
python调用matplotlib模块绘制柱状图
2019/10/18 Python
css3 2D图片转动样式可以扩充到Js当中
2014/04/29 HTML / CSS
html2canvas生成的图片偏移不完整的解决方法
2020/05/19 HTML / CSS
Antonioli美国在线商店:时尚前卫奢华
2019/07/29 全球购物
经典大学生求职信范文
2014/01/06 职场文书
培训讲师邀请函
2014/01/10 职场文书
秋季运动会表扬稿
2014/01/16 职场文书
师范生自我鉴定
2014/03/20 职场文书
党支部班子“四风”问题自我剖析材料
2014/09/28 职场文书
骨干教师申报材料
2014/12/17 职场文书
Python 游戏大作炫酷机甲闯关游戏爆肝数千行代码实现案例进阶
2021/10/16 Python