js中的for in迴圈和for迴圈有什麼區別
- 一个新手原創
- 2017-09-09 13:04:161955瀏覽
JavaScript for...in 語句
for...in 語句用於將陣列或物件的屬性循環操作。
for ... in 迴圈中的程式碼每執行一次，就會對陣列的元素或物件的屬性進行一次操作。
Tip:for-in迴圈應該用在非陣列物件的遍歷上，使用for-in進行迴圈也稱為「枚舉」。 ·
語法：
for (变量 in 对象)
{ 在此执行代码}
「變數」用來指定變數，指定的變數可以是陣列元素，也可以是物件的屬性。
實例：使用 for ... in 迴圈遍歷陣列。
<html><body><script type="text/javascript">var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
for (x in mycars)
{
document.write(mycars[x] + "<br />")
}</script></body></html>
注意一：for in迴圈不會依照屬性的下標來排列輸出。
//code from http://caibaojian.com/js-loop-for-in.html"first":"first", "zoo":"zoo", "2":"2", "34":"34", "1":"1", "second":"second"};for (var i in obj) { console.log(i); };输出：1234firstzoosecond
執行時按chrome執行，先把當中的非負整數鍵提出來，排序好輸出，然後將剩下的定義時的順序輸出。由於這個奇葩的設定，讓avalon的ms-with物件排序不如預期輸出了。只能強制使用者不要以純數字定義鍵名。
實例1:在陣列的原型物件上定義了一個新的屬性，使用for循環沒出現問題
function getNewArray(){var array=[1,2,3,4,5];Array.prototype.age=13;
var result = [];for(var i=0;i<array.length;i++){
result.push(array[i]);
}alert(result.join(''));
}
實例2：採用了for in循環,但是給我們期望的一樣還是得到了12345的正確結果
function getArrayTwo(){var array=[1,2,3,4,5 ];
var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}
實例3：為原型添加屬性之後，預設情況下枚舉，最後輸出1234513
function getNewArrayTwo(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;var result=[];
for(var i in array){
result.push(array[i]);
}alert(result.join(''));
}
所以建議不要對陣列執行for in循環，事實上，在高性能javascript這本書中,也強調了for in循環的不好,因為它總是會訪問該對象的原型,看下原型上是否有屬性,這在無意中就給遍歷增加了額外的壓力。
解決方法：
如果某個物件具有給定名稱的屬性,那麼Object.prototype.hasOwnProperty(name)傳回true。如果該物件是從原型鏈中繼承了該屬性,或根本沒有這樣的一個屬性,則傳回false。透過hasOwnProperty限定for in循環在目前中遍歷,而不用去考慮它的原型屬性。
function finalArray(){var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];for(var i in array){if(array.hasOwnProperty(i)){
result.push(array[i]);
}
}alert(result.join(''));
}
注意事項：
1.有一部分瀏覽器,例如早期的safari瀏覽器,不支援這個方法
2.物件經常被用作哈希值,這就是存在hasOwnProperty被另外的屬性屏蔽的風險（但是我估計沒有人那麼無聊使用這個屬性）
以上是js中的for in迴圈和for迴圈有什麼區別的詳細內容。更多資訊請關注PHP中文網其他相關文章！