JavaScript中for/in循环的陷阱与正确用法

Java与JavaScript循环机制对比

Java语言中的增强型for循环机制非常便捷，常用于集合遍历。

 
for (String str : list) {
System.out.println(str); // 此处str直接代表集合中的元素
} 

for/in循环遍历数组的陷阱

然而，JavaScript提供的for/in循环机制远比这复杂，它并非仅用于数组遍历。

 
var car
var garage= new Array()
garage[0] = "宝马"
garage[1] = "奔驰"
garage[2] = "宾利"
for (car in garage)
{ 
document.write(garage[car] + " ")
} 
// 预期输出：宝马 奔驰 宾利

表面上看，似乎成功获取了车辆列表。

但若对车库对象提出更高要求，例如添加状态属性或方法，情况将发生变化。

具体操作如下：

 
var car
var garage= new Array()
garage[0] = "宝马"
garage[1] = "奔驰"
garage[2] = "宾利"
garage.locked = true
garage.clean = function(){
alert("清洁")
} 
for (car in garage)
{ 
document.write(garage[car] + " ")
} 
// 实际输出：宝马 奔驰 宾利 true function (){ alert("清洁") }

结果显示，循环不仅遍历了数组索引，还输出了自定义属性和方法。

使用传统for循环规避问题

为避免此类意外，应回归使用传统的for循环。

 
var car
var garage= new Array()
garage[0] = "宝马"
garage[1] = "奔驰"
garage[2] = "宾利"
garage.locked = true
garage.clean = function(){
alert("清洁")
} 
for (car = 0;car < garage.length;car++)
{ 
document.write(garage[car] + " ")
} 
// 正确输出：宝马 奔驰 宾利

这样即可确保仅遍历数组元素，忽略额外属性。