JavaScript的for ... in循環是有奇怪的結果

我有以下對象：JavaScript的for ... in循環是有奇怪的結果

var r = { 
    obj: $(this), 
    children: $(this).children(), 
    panes: $('.rotatorPane', $(this)), 
    tagNames : [], 
    captions: [], 
    subcaptions: []  
};

$(this)是指以下DIV：

<div class="myRotator"> 
    <div class="rotatorPane"> 

    </div> 
    <div class="rotatorPane" id="pane3"> 

    </div> 

    <img src="img/1.jpg" alt="pane 1" class="rotatorPane" data-caption="Lorem Ipsum" data-subcaption="Dolor sit amet" /> 

</div>

我遇到的問題是與以下用於... in循環：

for(pane in r.panes){ 
    console.log(pane); 
}

輸出按預期開始：

0 
1 
2

但後來我得到了一堆的方法名稱爲輸出：

length 
prevObject 
context 
selector 
constructor 
init 
jquery 
size 
toArray 
get 
...etc

有誰知道爲什麼發生這種情況？

來源

2012-04-04 DC_

不要在數組或類似數組的東西上使用for ... in。使用數字索引變量。

for (var i = 0; i < r.panes.length; ++i) { 
    var pane = r.panes[i]; 
    // ... 
}

for ... in的形式是用於遍歷對象— 所有這些的屬性。當你想遍歷一個數組的索引屬性（或者，再次，你認爲是一個數組）時，總是使用數字索引。

在這種情況下，所討論的類似數組的對象是一個jQuery對象，除了數字索引屬性外，它還具有各種屬性。

來源

2012-04-04 19:08:04 Pointy

'爲in'只能檢索所有的鍵時使用一個東西。對於其原型尚未修改的簡單數組，除了迭代順序不能保證（特別是如果將項插入數組中間），大多數情況下都可以工作，所以您應該永遠不要使用它。 – 2012-04-04 19:11:08

嗯，是的，但是我個人試圖迴避那些「總是有效」的編碼實踐，當有一個簡單的替代方法* always *時。此外，對於某些代碼，您永遠不知道其環境可能會發生何種變化，以便Array原型獲得一些額外的可迭代屬性。是的，有'hasOwnProperty（）'測試，但如果你不得不去處理所有的麻煩，那看起來沒有意義。 – Pointy 2012-04-04 19:14:14

如果你閱讀我的評論，你會發現我的觀點是即使有一種方法可行，但你仍然不應該使用它。 – 2012-04-04 19:20:40

你應該使用jQuery的每個循環，我認爲，因爲你可能不能使用hasOwnProperty由於jQuery的增加它自己的方法和材料的對象

來源

2012-04-04 19:09:37 NickSlash

JavaScript的for ... in循環是有奇怪的結果

回答

相關問題