Javascript for in循环后的输出数组长度大于输入数组（未定义值）

这是我的html：

<div id='test'>
<input name="M1" size="3" value="1">
<input name="M2" size="3" value="2">
<input name="M3" size="3" value="3">
</div>

这是我的最终阵列arr2：

["1","2","3",undefined,undefined,undefined,undefined,undefined,undefined]

重点是arr.length是3，但arr2.length是9，有六个元素未定义。您能解释一下原因和更好的实现方法吗？

JavaScript中的循环在对象的可枚举属性上循环。在这里，您试图使用

for..在
arr
上的
中，它不是一个数组，它是一个（因为这是querySelectorAll的返回值）

节点列表具有以下可枚举属性：

0
1
2
length
item
entries
forEach
keys
values

如您所见，它不仅包含
arr
的索引，还包含所有可枚举属性。这意味着您的
for..in

循环将遍历其中的每一个。这就是为什么数组中的

undefined

为

arr['length']。例如，value

将为您提供

undefined

。 对于循环节点列表，可以使用常规For循环、a

For..of

循环或：

const test=document.getElementById（'test'）；
const nodes=test.queryselectoral（'input'）；
常数arr2=[]；
for（节点的常量输入）{
arr2.push（输入值）；
}
控制台日志（arr2）

forEach应该可以：


var test=document.getElementById（'test'）；
var arrinport=test.querySelectorAll（'input'）；
var arr2=[]；
arrInput.forEach（元素=>{
arr2.push（元素值）；
})
console.log（arr2）

对于（arr中的i）{console.log（i）；arr2.push（arr[i].value）；}
我怀疑这可能会让事情更清楚。顺便说一句：
let arr2=Array.from（test.querySelectorAll（'input'））.map（（inputEl）=>inputEl.value）
将是实现（明显的）所需最终结果的一种不太复杂的方法。另外：请参阅MDN.try
上的文档以获取（arr的常数i）{arr2.push（i.value）}
相反，

中的

不是集合迭代器，而是
的
是。。
0
1
2
length
item
entries
forEach
keys
values