高性能 javaScript 之遍歷對象屬性

 在面向對象的開發工做中，常常會遇到檢查對象屬性和遍歷對象屬性的狀況。 JavaScript 不包含如 java、C 等語言的傳統類繼承模型，而是使用 prototype 原型模型。

JavaScript 原型鏈繼承中屬性查找過程

當查找一個對象的屬性時，JavaScript 會向上遍歷原型鏈，直到找到給定名稱的屬性爲止。
到查找到達原型鏈的頂部 - 也就是 Object.prototype - 可是仍然沒有找到指定的屬性，就會返回 undefined。

使用 for in 循環能夠遍歷對象全部的屬性，包括該對象在原型鏈中的屬性，如：
  

var a = {
        a:1,
        b:2
  };
                        
  var b = Object.create(a);
                        
  b.c = 3;

  var c = Object.create(b);
                        
  c.d = 4;
                        
  for(var key in c){
    console.log(c[key])
  }
  
  //會在控制檯中依次打印出4 3 1 2
 

注意在控制檯中打印的順序是 4 3 1 2，而不是 1 2 3 4，這就解釋了原型鏈繼承時查找屬性的過程是先查找自身屬性，當自身屬性不存在時，會在原型鏈中逐級查找。

有時候咱們並不想要這樣的結果，咱們只想要獲取對象自身的屬性（不包括對象原型鏈上的屬性），何況每次遍歷都要查找對象的原型鏈，這樣會形成性能負擔。

hasOwnProperty 函數

hasOwnProperty 函數能夠用來檢查對象自身是否含有某個屬性，返回值是布爾值，當屬性不存在時不會向上查找對象原型鏈。

用個例子來看看 hasOwnProperty 和 for in 的區別：
 

if（var "a" in c){
  console.log(c["a"])  //屬性 a 是原型鏈上的屬性， 輸出 1
}

if（c.hasOwnProperty("a")){
  console.log(c["a"])  //屬性 a 不是自身屬性，不會執行這一步
}

getOwnPropertyNames 函數

getOwnPropertyNames 函數能夠獲取對象全部的自身屬性，返回值是由對象自身屬性名稱組成的數組，一樣不會向上查找對象原型鏈。

如：
 

console.log(Object.getOwnPropertyNames(c))  //輸出 ["d"]

getOwnPropertyNames 函數遍歷全部對象全部自身屬性，例：
 

（fucntion(){   var propertys = Object.getOwnPropertyNames(c);   var len = propertys.length;   for(var i = 0; i < len; i++){     var key = propertys[i];     console.log(c[key])  //輸出 4   } })();    更多精彩內容分享，加羣434623999