Javascript 无法将传统for循环转换为for each循环

出于某种莫名其妙的原因，我无法将此循环转换为（FizzPlayer中的var player）{…}循环的更自然的

：

  for (var i = 0; i < fizzPlayers.length; i++) {
    var player = fizzPlayers[i];
    var val = parseInt(player.value);
    if (val != 0) {
      active.push(player);
      actfact.push(parseInt(player.value));
      actname.push(capitaliseFirstLetter(player.id));
    }
  }

但是它不起作用，正如您在底部的可运行代码片段中看到的那样

为了进行调试，我在循环之前插入了以下代码：

  // prints undefined... but why?
  for (var player in fizzPlayers) {
    console.log(player.value);
  }

它为5名玩家打印
未定义的
。为什么？程序前面有一个类似的循环，
for（fizzPlayers中的var-player）{…}
循环工作正常

为什么会这样？我错过了什么


var fizzLoaded=false；
var fizzDiv、fizzFrom、fizzTo、fizzPlayers；
函数fizzLoad（）{
如果（满负荷）{
返回；
}
fizzLoaded=true；
var fizzForm=document.getElementById（'fizzbuzz'）；
fizzFrom=document.getElementById（'rangeFrom'）；
fizzTo=document.getElementById（'rangeTo'）；
起泡剂=[
document.getElementById（'frodo'），
document.getElementById（'sam'），
document.getElementById（'merry'），
document.getElementById（'pippin'），
document.getElementById（'bilbo'）
];
fizzDiv=document.getElementById（'fizzOut'）；
}
函数限制范围（）{
var rFrom=parseInt（fizzFrom.value）；
var rTo=parseInt（fizzTo.value）；
fizzTo.min=rFrom；
fizzFrom.max=rTo；
}
函数validateValues（）{
var rFrom=parseInt（fizzFrom.value）；
var rTo=parseInt（fizzTo.value）；
如果（rTo100）{
警报（“非法值”+val+“对于玩家”+player.id）；
返回false；
}
}
返回true；
}
函数资本主义者（字符串）{
返回string.charAt（0.toUpperCase（）+string.slice（1）；
}
函数嘶嘶作响（）{
fizzLoad（）；
限制范围（）；
如果（！validateValues（））{
fizzDiv.innerHTML=“非法输入”；
返回；
}
var表=”；
var rFrom=parseInt（fizzFrom.value）；
var rTo=parseInt（fizzTo.value）；
var活跃=[]；
var actfact=[]；
var actname=[]；
//打印未定义…但为什么？
for（FizzPlayer中的var播放器）{
console.log（player.value）；
}
for（FizzPlayer中的var播放器）{
var val=parseInt（player.value）；
如果（val！=0）{
主动推（玩家）；
push（parseInt（player.value））；
actname.push（capitaliefirstletter（player.id））；
}
}
表+=“\n”；
表+=“ValueMessage\n”；
对于Javascript中的（var i=rFrom；i，for each
循环将索引分配给控制变量，因此您需要使用
fizzPlayers[player]
，而不仅仅是
player
。您可能不喜欢它（我通常不喜欢），但它就是这样工作的。
JavaScript

中的

for in

循环在对象的可枚举属性中运行。因此，您不能将其转换为经典的

for

循环。更正式地说，从：

for…in循环只在可枚举属性上迭代 从内置构造函数（如数组和对象）创建 从Object.prototype和继承的不可枚举属性 prototype，例如字符串的indexOf（）方法或对象的 方法。循环将迭代所有可枚举的 对象本身的属性以及对象从其继承的属性 构造函数的原型（属性更接近 原型链覆盖原型的属性）

你需要

for (var p in fizzPlayers) {
    console.log(fizzPlayers[p].value);
}

这是一种常见的烦恼

---

编写循环遍历数组元素的惯用方法是

forEach

。正如注释所指出的，

for…in

用于对象键，而不是数组元素

fizzPlayers.forEach(function(player) {
  var val = parseInt(player.value);
  if (val != 0) {
    active.push(player);
    actfact.push(parseInt(player.value));
    actname.push(capitaliseFirstLetter(player.id));
  }
});

您可以在中

Array.prototype.forEach

---

检查实际分配给

玩家的内容

：

> fizzPlayers = ["jim", "bob", "joe"]
> for (var player in fizzPlayers) {
    console.log(player);
  }
0
1
2

遍历对象会得到关键点。数组的关键点就是索引。在这种情况下，最好使用常规的for循环，而不是每个循环都使用这个for循环，因为如果您为数组指定了任何其他属性（如

fizzPlayers.barg=40；

），则for-each循环也会给出这些属性名称

---

但是，如果您使用的是jQuery，则可以使用：

---

请注意，回调包含两个参数：索引和值。

for each循环分配索引

// prints undefined... but why?
for (var playerIndex in fizzPlayers) {
   console.log(fizzPlayers[playerIndex].value);
}

---

你可以考虑一个方便的库，比如实用程序。

右，< <代码> >在循环中与<<代码>循环不一样。你不应该在中使用<代码>来循环数组。谢谢，这非常有见识！你有没有链接到这个主题的正确文档？ks，请将其编辑到您的答案中，这样对每个人来说都更容易阅读。顺便说一句，为什么在

validateValues

函数中，

player

引用数组中每个元素的索引，比如

0

。一个数字没有

值

属性，所以

player

引用数组中每个元素的索引de>player.value为

未定义

parseInt（未定义）

为

NaN

，既不小于0也不大于100。

> fizzPlayers = ["jim", "bob", "joe"]
> for (var player in fizzPlayers) {
    console.log(player);
  }
0
1
2

> $.each(fizzPlayers, function (index, player) { 
    console.log(index + ": " + player); 
  });
0: jim
1: bob
2: joe

// prints undefined... but why?
for (var playerIndex in fizzPlayers) {
   console.log(fizzPlayers[playerIndex].value);
}