JavaScript For 與 For in

For 與 For In

• for 功用是迭代陣列，用於陣列或類似陣列的物件。
• for in 功用是列舉非陣列的物件，就是一一列舉出非陣列物件的屬性。

Note：

 　技術上for in也可以用於Array，因為在JavaScript環境中，Array也是物件，但是不要這麼做，因為fon in不像for會確保迭代的順序，另外若是物件有客製化擴充功能，可能會導致邏輯上的錯誤發生。

在使用for in列舉物件時可以使用hasOwnProperty()來過濾掉來自原型鏈(prototype chain)上的屬性。

<script>
(function(window, undefined){    
    var car = {
        name:'Golf',
        color:"Black" 
    };
    
    //假設在程式的其他地方有人對Object原生物件增加了一個方法
    if(typeof Object.prototype.printName === 'undefined'){
        Object.prototype.printHaHa = function(){
            console.log('ha ha');
        }
    }
    
    
    //使用fon in 列舉屬性時    
    for(var attribute in car){
        console.log(attribute,':',car[attribute]);
    }   
    
    console.log('-------------------------------');
    
    //使用hasOwnProperty來過濾    
    for(var attribute in car){
        if(car.hasOwnProperty(attribute)){
            console.log(attribute,':',car[attribute]);
        }
    }
})(window);
</script>

chrome上的輸出：

name : Golf filter_pototype_attribute.html:25

color : Black filter_pototype_attribute.html:25

printHaHa : function (){ console.log('ha ha'); } filter_pototype_attribute.html:25

------------------------------- filter_pototype_attribute.html:28

name : Golf filter_pototype_attribute.html:33

color : Black

我們可以看到，虛線分隔之後的輸出，不會列舉出printHaHa項目。