【Js】深入浅出的js for循环 for loop以及闭坑指南

在JavaScript中使用forEach循环来删除数组中的特定元素可能会导致一些问题,因为forEach不允许你在迭代过程中修改数组的长度。
这会导致意外的行为,例如跳过元素或错误地索引。因此,建议使用其他方法来安全地删除数组中的元素。
存在的问题
1. 数组长度改变:forEach循环期间,如果你删除了一个元素,数组的长度会改变,
这可能导致一些元素被跳过或多次处理。  
处理少量数据, 这个问题不显著, 当处理成千上万的数据, 会出现数据差异问题, 坑就在这.
2. 无法中途停止:forEach无法中途停止循环,即使你找到了需要删除的元素。

替代方法
  • 使用filter方法:
filter方法会创建一个新的数组,其中包含所有通过指定函数测试的元素。这样可以避免修改数组长度的问题。
 
let array = [1, 2, 3, 4, 5]; 
let elementToRemove = 3; 
array = array.filter(item => item !== elementToRemove); 
console.log(array); // 输出: [1, 2, 4, 5]
  • 使用for循环
使用普通的for循环, 从后向前遍历数组,可以安全地删除元素而不会跳过任何元素。
let array = [1, 2, 3, 4, 5];
let elementToRemove = 3;
for (let i = array.length - 1; i >= 0; i--) {
    if (array[i] === elementToRemove) {
        array.splice(i, 1);
    }
}
console.log(array); // 输出: [1, 2, 4, 5]

总结
虽然可以使用forEach来迭代数组,但删除元素时应该使用其他方法来避免潜在的问题。
filter方法和从后向前的for循环是更安全和可靠的选择。

从前往后的for循环,  从后往前的for循环 正确使用:

 

  • 从前往后的for循环(需要额外处理索引)
let array = [1, 2, 3, 4, 5];
let elementToRemove = 3;

for (let i = 0; i < array.length; i++) {
    if (array[i] === elementToRemove) {
        array.splice(i, 1);
        i--; // 调整索引以确保不会跳过下一个元素
    }
}

console.log(array); // 输出: [1, 2, 4, 5]

  • 从后往前的for循环(无需额外处理索引)
let array = [1, 2, 3, 4, 5];
let elementToRemove = 3;

for (let i = array.length - 1; i >= 0; i--) {
    if (array[i] === elementToRemove) {
        array.splice(i, 1);
    }
}

console.log(array); // 输出: [1, 2, 4, 5]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/680916.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

TechM-技术网站

介绍 你将为⼀个技术社区设计并实现⼀个官⽹。该社区旨在为软件⼯程师、开发⼈员和技术 爱好者提供⼀个交流平台&#xff0c;分享最新的技术动态、⽂章、项⽬案例。 项目模块 项目分为三个模块 &#xff1a; 主页展示模块&#xff0c;文章详情模块&#xff0c;文章专栏模块…

Terraform安装+部署Azure Resource笔记

安装 下载 Terraform&#xff1a; 首先&#xff0c;访问 官方 Terraform 网站。找到适用于 Windows 的 Terraform 包&#xff0c;并下载 zip 文件。解压 Terraform 包&#xff1a; 将下载的 zip 文件解压到一个新文件夹中&#xff0c;命名为 “Terraform”。可以选择任何位置作…

短剧APP开发,推动短剧市场的全新发展

近几年&#xff0c;短剧火爆出圈&#xff0c;迎来了爆发式增长态势&#xff0c;市场规模一跃达到了百亿元&#xff01;短剧节奏快、剧情爽、情节猎奇&#xff0c;极大地满足了用户的追剧需求&#xff0c;深受大众的喜爱。 短剧巨大的市场发展前景也衍生出了各种新的短剧发展赛…

原子阿波罗STM32F429程序的控制器改为STM32F407

以前&#xff0c;学习原子的探索者开发板&#xff0c;有STM32F407ZGT6开发板&#xff0c;现在想学习阿波罗开发板&#xff0c;但手头没有F429开发板&#xff0c;于是&#xff0c;想把STM32F429芯片替换为STM32F407芯片&#xff0c;本以为没有什么难度&#xff0c;但是替换后发下…

2024年城市建设与环境管理国际会议(ICUCEM 2024)

2024 International Conference on Urban Construction and Environmental Management 【1】大会信息 大会地点&#xff1a;中国成都 投稿邮箱&#xff1a;icucemsub-paper.com 【2】会议简介 2024年城市建设与环境管理国际会议是一个专注于探讨城市建设与环境管理前沿议题…

docker实现jenkins+git+naocas一体化自动部署

一、jenkins安装 1.1 docker 安装jenkins docker pull jenkins/jenkins 1.2 docker 启动jenkins docker run --name myjenkins -d -p 8081:8080 -p 8085:8085 jenkins/jenkins –name 指定容器名称为myjenkins -d 表示后台运行 -p 8081&#xff1a;8080 表示Docker Host(运行Do…

从头搭hadoop集群--分布式hadoop集群搭建

模板虚拟机安装配置见博文&#xff1a;https://blog.csdn.net/weixin_66158110/article/details/139236148 配置文件信息如下&#xff1a;https://pan.baidu.com/s/1074eD5aNVugEPcjwVvi9jA?pwdl1xq&#xff08;提取码&#xff1a;l1xq&#xff09; hadoop版本&#xff1a;h…

凸包算法Revit实例

ConvertHullAlgorithm &#xff08;凸包算法&#xff09; 引用 《计算几何》-导言&#xff1a;凸包的例子 前言 算法的基本逻辑与理念来自于《计算几何》这本书&#xff0c;后面其他几章的演示也都会在Revit中实现调试&#xff0c;希望能够每个算法都找一个合适的实现方向在R…

宏集ASPION高性能加速度记录仪,为您的货物运输定制专属监测方案

一. 运输货物的荷载 根据圣加仑大学的一项研究&#xff0c;在全球货物运输中&#xff0c;三分之一的货物因运输损坏而被收件人投诉。无论是由于振动还是天气的影响&#xff0c;物流业每天都会发生损坏&#xff0c;尽管原因往往还不清楚。电子数据记录器允许可靠地记录运输过程…

数据结构:模拟队列

数据结构&#xff1a;模拟队列 题目描述参考代码 题目描述 输入样例 10 push 6 empty query pop empty push 3 push 4 pop query push 6输出样例 NO 6 YES 4参考代码 #include <iostream>using namespace std;const int N 100010;int q[N], hh, tt;int m, x; string …

PlugLink与RPA的完美结合:打造智能自动化工作流(附源码)

PlugLink与RPA的完美结合&#xff1a;打造智能自动化工作流 自动化技术已经成为提高效率和减少错误的关键手段。两种主要的自动化技术——PlugLink和RPA&#xff08;机器人流程自动化&#xff09;——各有特色。本文将详细探讨PlugLink与RPA的不同之处&#xff0c;并介绍它们如…

SpringBoot: 使用GraalVM编译native应用

曾今Go语言里让我最艳羡的两个特性&#xff0c;一个是Goroutine&#xff0c;一个是native编译。 Java 21的虚线程实现了类似Goroutine的能力。Spring Boot 3.x开始提供了GraalVM的支持&#xff0c;现在Spring Boot也能打包成native文件了。 这一篇文章的目标是用一个案例讲解如…

ATA-7015增材制造测试高压放大器的应用场景介绍

微纳3D打印技术是一种结合了微纳米制造和3D打印的先进制造技术。它能够在微米甚至纳米级别上&#xff0c;将复杂的3D结构精确地打印出来。这种技术的出现&#xff0c;使得我们可以在一个微观的世界里&#xff0c;以难以置信的精度和效率&#xff0c;进行各种材料的制造和加工。…

#02 安装指南:如何配置Stable Diffusion环境

文章目录 前言前置条件第1步&#xff1a;安装Python和PIP第2步&#xff1a;创建虚拟环境第3步&#xff1a;安装PyTorch和CUDA第4步&#xff1a;安装Stable Diffusion相关库第5步&#xff1a;测试环境结论 前言 在之前的文章中&#xff0c;我们介绍了Stable Diffusion基础入门和…

【Python】 探索Python单元测试:运行unittest测试用例

基本原理 单元测试是软件开发过程中的一个重要环节&#xff0c;它可以帮助开发者确保每个单独的组件或模块都能按预期工作。在Python中&#xff0c;unittest是一个内置的测试框架&#xff0c;它提供了丰富的功能来支持自动化测试。 unittest测试框架的核心是测试用例&#xf…

2024第26届大湾区国际电机博览会暨发展论坛

2024第二十六届大湾区国际电机博览会 暨发展论坛 2024第26届大湾区国际电机博览会暨发展论坛 The 26th Greater Bay Area International Motor Expo and Development Forum 时间&#xff1a;2024年12月4-6日 地址&#xff1a;深圳国际会展中心&#xff08;宝安新馆&#x…

【计算机网络】对应用层HTTP协议的重点知识的总结

˃͈꒵˂͈꒱ write in front ꒰˃͈꒵˂͈꒱ ʕ̯•͡˔•̯᷅ʔ大家好&#xff0c;我是xiaoxie.希望你看完之后,有不足之处请多多谅解&#xff0c;让我们一起共同进步૮₍❀ᴗ͈ . ᴗ͈ აxiaoxieʕ̯•͡˔•̯᷅ʔ—CSDN博客 本文由xiaoxieʕ̯•͡˔•̯᷅ʔ 原创 CSDN 如…

java代码审计之fastjson反序列化漏洞

fastjson反序列化漏洞分析 Fastjson 是一个 Java 库&#xff0c;可以将 Java 对象转换为 JSON 格式&#xff0c;当然它也可以将 JSON 字符串转换为 Java 对象。Fastjson 可以操作任何 Java 对象&#xff0c;即使是一些预先存在的没有源码的对象。该产品主要提供了两个接口&…

nginx与busybox离线镜像安装包

目录 概述实践离线资源nginxbusybox加载上传harbor 概述 nginx与busybox离线镜像安装包制作。如有疑问&#xff0c;详细请参考 docker镜像的导入导出 实践 离线资源 如果懒得弄&#xff0c;请至此下载 nginx、busybox (2024-06-04相对今天是最新版本) nginx 先找一台装有 d…

【知识点小结】目标检测深度学习算法网络训练时的一些注意事项

验证模型的batch size如何设置&#xff1f; 若输入模型数据shape固定&#xff0c;验证时对batch size无限制若输入模型数据shape不固定&#xff0c;验证时将batch size设置成1 训练模型需要提前热身&#xff1f;&#xff08;Warm-up&#xff09; 主要为了解决初始学习率过大…