javaScript遍歷對象屬性

javascript遍歷對象的屬性並無像java中遍歷一個Map那麼簡單，主要緣由有如下兩點:

1. 在javascript中對象的屬性分爲可枚舉與不可枚舉之分,他們是由屬性的 enumerable 的值決定的。可枚舉性
   決定了這個屬性是否能夠被 for-in 遍歷到。
2. javascript的對象通常都處於原型鏈中，它會從上層原型對象上繼承一些屬性

根據這兩點特性，咱們能夠分爲 4 種狀況來遍歷javascript對象屬性

1.遍歷自身可枚舉的屬性 (可枚舉，非繼承屬性) Object.keys() 方法

---

該方法會返回一個由一個給定對象的自身可枚舉屬性組成的數組，數組中的屬性名的排列順序和使用for..in遍歷該對象時返回的順序一致（二者的區別是 for ..in還會枚舉其原型鏈上的屬性 ）

/**Array 對象**/
var arr = ['a','b','c'];
console.log(Object.keys(arr));  
// ['0','1','2']

/**Object對象**/
var obj = {foo:'bar',baz:42};
console.log(Object.keys(obj));
// ["foo","baz"]

/**類數組 對象  隨機key排序**/
var anObj ={100:'a',2:'b',7:'c'};
console.log(Object.keys);
//['2','7','100']

/***getFoo 是一個不可枚舉的屬性**/
var my_obj = Object.create(
   {}, 
   { getFoo : { value : function () { return this.foo } } }
);
my_obj.foo = 1;

console.log(Object.keys(my_obj)); 
// ['foo']

2.遍歷自身的全部屬性(可枚舉，不可枚舉，非繼承屬性) Object.getOwnPropertyNames()方法

---

該方法返回一個由指定對象的全部自身屬性組成的數組(包括不可枚舉屬性但不包括Symbol值做爲名稱的屬性)

var arr = ["a", "b", "c"];
console.log(Object.getOwnPropertyNames(arr).sort()); // ["0", "1", "2", "length"]

// 類數組對象
var obj = { 0: "a", 1: "b", 2: "c"};
console.log(Object.getOwnPropertyNames(obj).sort()); // ["0", "1", "2"]

// 使用Array.forEach輸出屬性名和屬性值
Object.getOwnPropertyNames(obj).forEach(function(val, idx, array) {
  console.log(val + " -> " + obj[val]);
});
// 輸出
// 0 -> a
// 1 -> b
// 2 -> c

//不可枚舉屬性
var my_obj = Object.create({}, {
  getFoo: {
    value: function() { return this.foo; },
    enumerable: false
  }
});
my_obj.foo = 1;

console.log(Object.getOwnPropertyNames(my_obj).sort()); // ["foo", "getFoo"]

3.遍歷可枚舉的自身屬性和繼承屬性 （可枚舉，可繼承的屬性） for in

---

遍歷對象的屬性
var obj={
    name：'張三',
    age : '24',
    getAge:function(){
        console.log(this.age);
    }
}
var arry ={};
for(var i in obj){
    if(obj.hasOwnProperty(i)&& typeOf obj[i] != 'function'){
        arry[i] = obj[i];
    }
}
console.log(arry);
{name:'張三',age:24}

注: hasOwnProperty()方法判斷對象是有某個屬性(自己的屬性，不是繼承的屬性)

4.遍歷全部的自身屬性和繼承屬性

---

(function () {
    var getAllPropertyNames = function (obj) {
        var props = [];
        do {
            props = props.concat(Object.getOwnPropertyNames(obj));
        } while (obj = Object.getPrototypeOf(obj));
        return props;
    }
    var propertys = getAllPropertyNames(window);
    alert(propertys.length);          //276
    alert(propertys.join("\n"));      //toString等
})()