JavaScript中的for-in迭代
[英]for-in iteration in Javascript
問題描述
到代碼：
<!DOCTYPE html>
<html>
<body>
<p>This.........</p>
<p>That.....</p>
<p>And yet .....</p>
<script>
x=document.getElementsByTagName("p");
for (i in x)
document.write("..."+x[i].innerHTML+" "+i+"<br>");
document.write(x.length);
</script>
</body>
</html>
我正在輸出
This.........
That.....
And yet .....
...This......... 0
...That..... 1
...And yet ..... 2
...undefined item
...undefined namedItem
...undefined iterator
...undefined length
3
而不是我所期望的以下內容：
This.........
That.....
And yet .....
...This......... 0
...That..... 1
...And yet ..... 2
3
該換的語句應該在X重復多次x的長度-這是3作為代碼本身saying--並終止。 相反，這似乎是在節點的所有子節點上進行迭代-不僅是document.getElementsByTagName（“ p”）返回的段落標簽。
這可能是我在代碼中缺少的一些精妙之處，或者是JavaScript引擎中的錯誤。
這里缺少什么？
2 個解決方案
解決方案1
7 已采納 2013-10-30 23:27:18
不要將for ... in用於數組和類似NodeList對象之類的數組。 始終使用數字索引。
for ... in構造用於迭代對象的可枚舉屬性。 嚴格來說，它甚至不能保證數字屬性將按數字順序遍歷！ 使用數字索引，或者將類似數組的對象轉換為實數組並使用.forEach() （在較新的瀏覽器中）：
var x = document.getElementsByTagName("p");
[].slice.call(x, 0).forEach(function(value, index) {
document.write("..." + value.innerHTML + " " + index + "<br>");
});
編輯 -RobG正確指出.slice()技巧在IE9之前的IE版本中不起作用。 使用帶數字索引的簡單for循環來完成相同的事情很容易，因此，如果您擔心IE8或更低版本，只需執行以下操作：
var x = document.getElementsByTagName("p");
for (var i = 0; i < x.length; ++i) {
// whatever with x[i]
}
我認為Mozilla確實是舊版本，甚至不支持對Node對象使用數組索引。 您必須使用.item( i )方法。 我認為對於現實的新代碼而言，這不是一個嚴重的問題。
解決方案2
1 2013-10-30 23:27:33
var x=document.getElementsByTagName("p");
for(var i=0;i<x.length;i++)
{
document.write("..."+x[i].innerHTML+" "+i+"<br>");
}
為什么for-in的javascript速度很慢？
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.