javascript在数组的循环中删除元素
在开发JavaScript应用的过程中,经常会遇到在循环中移除指定元素的需求。
按照常规的思路,就是对数组进行一个for循环,然后在循环里面进行if判断,在判断中删除掉指定元素即可。
但是实际情况往往不会像预想的那样顺利运行。
出现的问题场景还原
(function () {
var arr = [1, 2, 2, 3, 4, 5];
for (var i = 0; i < arr.length; i++){
// 打印数组中的情况,便于跟踪数组中数据的变化
console.log(i + ' = ' + arr[i]);
// 删除掉所有为2的元素
if(arr[i] === 2) {
arr.splice(i, 1);
}
}
console.log(arr);
})();
从最终的结果可以看到,这段代码实际上只删除掉了匹配的其中一个元素,而另一个匹配条件的元素还存在,并不符合程序设计的初衷。
而从打印出来的运行过程不难发现,产生这个结果的原因是因为,当删除掉了一个元素后,数组中元素的索引(下标)发生了实时变化,造成了程序的异常。
解决问题的方法
找到了出现问题的原因,就不难解决问题了。
方法1:实时调整数组中元素的下标对应关系。
(function () {
var arr = [1, 2, 2, 3, 4, 5];
for (var i = 0; i < arr.length; i++){
// 打印数组中的情况,便于跟踪数组中数据的变化
console.log(i + ' = ' + arr[i]);
// 删除掉所有为2的元素
if(arr[i] === 2) {
arr.splice(i--, 1);
}
}
console.log(arr);
})();
出现问题的原因,是因为移除掉中间的一个元素之后,该元素后面的元素的索引(下标)都往前加1了,那么我们可以在删除元素后手动将循环中的下标重置为现在对应的下标即可(i--)。
方法2:从后往前遍历数组元素。
(function () {
var arr = [1, 2, 2, 3, 4, 5];
for (var i = arr.length - 1; i >= 0; i--) {
// 打印数组中的情况,便于跟踪数组中数据的变化
console.log(i + ' = ' + arr[i]);
// 删除掉所有为2的元素
if(arr[i] === 2) {
arr.splice(i, 1);
}
}
console.log(arr);
})();
出现问题的原因,是因为移除掉中间的一个元素之后,该元素后面的元素的索引(下标)都往前加1了,那么只要是从后往前循环,就可以不用管后面元素的索引(下标)了。
方法3:使用while循环代替for循环(还是从后往前循环)。
(function () {
var arr = [1, 2, 2, 3, 4, 5];
var i = arr.length;
while(i--) {
console.log(i + ' = ' + arr[i]);
if(arr[i] === 2) {
arr.splice(i, 1);
}
}
console.log(arr);
})();
同上面从后往前循环的原理一致,只是将for循环使用了while循环代替。
"明天的今天是昨天,昨天又是新的一天。"
javascript在数组的循环中删除元素的更多相关文章
- Java中list在循环中删除元素的坑
JAVA中循环遍历list有三种方式for循环.增强for循环(也就是常说的foreach循环).iterator遍历. 1.for循环遍历list for(int i=0;i<list.siz ...
- list for循环中删除元素
Iterator.remove() is safe, you can use it like this: List<String> list = new ArrayList<> ...
- java 在循环中删除数组元素
在写代码中经常会遇到需要在数组循环中删除数组元素的情况,但删除会导致数组长度变化. package com.fortunedr.thirdReport; import java.util.ArrayL ...
- Java循环中删除一个列表元素
本文主要想讲述一下我对之前看到一篇文章的说法.假设跟你的想法有出入,欢迎留言.一起讨论. #3. 在循环中删除一个列表元素 考虑以下的代码.迭代过程中删除元素: ArrayList<String ...
- PHP从数组中删除元素的方法
PHP从数组中删除元素的方法 本篇文章主要介绍了PHP从数组中删除元素的四种方法实例 删除一个元素,且保持原有索引不变 使用 unset 函数,示例如下: 1 2 3 4 5 <?php $ ...
- PHP从数组中删除元素的四种方法实例
PHP从数组中删除元素的四种方法实例 一.总结 一句话总结:unset(),array_splice(),array_diff(),array_diff_key() 二.PHP从数组中删除元素的四种方 ...
- MongoDB 学习笔记之 从数组中删除元素和指定数组位置
从数组中删除元素: 从数组中删除单个元素: db.ArrayTest.updateOne({ "name" : "Bill"},{$pop: {"ad ...
- Java ArrayList正确循环添加删除元素方法及分析
在阿里巴巴Java开发手册中,有这样一条规定: 但是手册中并没有给出具体原因,本文就来深入分析一下该规定背后的思考. 一.foreach循环 foreach循环(Foreach loop)是计算机编程 ...
- Jquery中删除元素方法
empty用来删除指定元素的子元素,remove用来删除元素,或者设定细化条件执行删除 语法: empty() remove(expr); empty用来删除指定元素的子元素,remove用来删除元素 ...
随机推荐
- 【学习笔记】《Java编程思想》 第1~7章
第一章 对象导论 对整书的概要. 略读. 第二章 一切都是对象 创建一个引用,指向一个对象. 安全的做法:创建一个引用的同时便进行初始化. 对象存储的地方:1)寄存器:这是最快的存储区,因为它位于不同 ...
- jvaa之初始化块
1.初始化块的作用:对java对象进行初始化: 2.程序的执行顺序:声明成员变量的默认值-->显示初始化,多个初始化块依次被执行(同级别下按先后顺序执行)-->构造器在对成员进行赋值操作. ...
- java之四种权限修饰符
java权限修饰符piublic.protected.private.置于类的成员定义前,用来限定对象对该类成员的访问权限. 修饰符 类内部 同一个包 子类 任何地方 private yes ...
- java获取当前年份、月份和日期字符串等
Java获取当前年份.月份和日期是通过Calendar类的实例对象来获取的. 首先创建一个Calendar类的实例对象,Calendar类属于java.util包. Calendar calendar ...
- Mysql数据基本操作(增、删、改、查)
一.数据库配置 # 通过配置文件统一配置的目的: 统一管理 服务端(mysqld).客户端(client) 1.配置mysqld(服务端)的编码为utf-8,再创建数据库的时候,默认编码都采用了utf ...
- Kubernetes的CronJob对象
CronJob说白了就是用来管理Job对象的控制器, 通过jobTemplate管理Job对象,定时执行,最终实现我们的cron功能 示例 apiVersion: batch/v1beta1 kind ...
- Eclipse中Junit测试中@Before不执行
场景 在使用Junit进行单元测试时,一部分获取JPA的entityManager的代码将其放在了 @Before标注的方法中,这样每次执行@TEST标注的方法时会首先执行@Before标注的方法. ...
- Vim 宏实战操作
宏的概念 什么是宏呢?英文名:macro,代表一串命令的集合. 示例操作文本 SELECT * FROM `edu_ocr_task` WHERE ((`userId`=284871) AND (`u ...
- JAVA学习第二步,初级知识框架梳理
回顾往期的学习,才发现已经学习了这么多知识点.这里复制了其他创作者的一些梳理结合自己的梳理.总结了自己在Java学习入门阶段的知识点.笔记自己了也写了详细的两本 第一章 Java面向对象 1-1包的定 ...
- SSM框架之Mybatis(5)数据库连接池及事务
Mybatis(5)数据库连接池及事务 1.Mybatis连接池 Mybatis 中也有连接池技术,但是它采用的是自己的连接池技术.在 Mybatis 的 SqlMapConfig.xml 配置文 ...