LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

for...in 循环的坑,别再用它遍历 JavaScript 数组了!

zhenglin
2025年11月3日 16:20 本文热度 251

在JavaScript开发中,for...in循环是一个常见的语法结构,但它在遍历数组时存在很多潜在问题。

这些问题如果不加以注意,可能导致意想不到的bug和性能问题。


for…in 循环的本质

for...in循环是设计用来遍历对象属性的,而不是专门为数组设计的。它会遍历对象的所有可枚举属性,包括:

  • 数组索引

  • 自定义属性

  • 原型链上的属性


主要问题

1. 遍历顺序不保证

for...in不保证按特定顺序遍历数组元素,这与数组的本质(有序集合)相悖:

const arr = [10, 20, 30];for (let i in arr) {console.log(i, arr[i]); // 输出顺序可能不是0,1,2}


2. 遍历非元素属性

如果你给数组添加了自定义属性,for...in也会遍历这些属性:


const arr = [10, 20, 30];arr.customProp = "hello";for (let i in arr) {console.log(i, arr[i]); // 会输出 "customProp" "hello"}


3. 原型污染问题

如果修改了Array.prototypefor...in会遍历这些新增的属性:


更好的替代方案

1. for循环

最传统也最可靠的方式:


2. for…of循环

ES6引入的专门用于遍历可迭代对象的语法:



3. forEach方法

数组内置的遍历方法:


4. map, filter, reduce等

根据具体需求选择更专业的数组方法:


什么时候可以使用for…in?

for...in在遍历普通对象属性时非常有用:


const person = {name: "张三", age: 30, job: "开发者"};for (const key in person) {console.log(key, person[key]);}

 

 参考文章:原文链接


该文章在 2025/11/3 16:21:19 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2025 ClickSun All Rights Reserved