Javascript效能分析——迴圈遍曆

Javascript定義了4種迴圈，分別是for,while,do-while及for-in。前三種迴圈的效能相差不大，但是for-in迴圈效能非常差，它在每次迴圈執行時，需要遍曆對象中的所有屬性包括從原型鏈繼承而來的，至於它的效能到底有多少糟糕以下是Chrome18下的測試（用YUI Profiler做分析工具，如果不會用它可見我之前寫的 Javascript效能分析——工具（YUI Profiler）上）http://www.bkjia.com/kf/201204/126311.html ：
//數組長度
var loopCount = 20000000;

//準備測試數組
var mockAry = new Array();
for (var i = 0 ; i < loopCount; i++){
    mockAry.push(i);
}

//for迴圈
function testForAry(){
    for (var i = 0 ; i < loopCount; i++){
        var value = mockAry[i];
    }
}

//while迴圈
function testWhileAry(){
    var i = 0;
    while(i < loopCount){
        var value = mockAry[i];
        i++;
    }
}

//do-while迴圈
function testDoWhileAry(){
    var i = 0;
    do{
        var value = mockAry[i];
        i++;
    }while(i < loopCount);
}

//for-in迴圈
function testForInAry(){
    for (var item in mockAry){
        var value = item;
    }
}

//註冊待測試方法
YAHOO.tool.Profiler.registerFunction("testForAry", window);
YAHOO.tool.Profiler.registerFunction("testWhileAry", window);
YAHOO.tool.Profiler.registerFunction("testDoWhileAry", window);
YAHOO.tool.Profiler.registerFunction("testForInAry", window);

//每個測試方法被測試幾次
var testCount = 10;

for(var i =0; i < testCount ;i++){
    testForAry();
    testWhileAry();
    testDoWhileAry();
    testForInAry();
}

//產生測試報告
var report1 = YAHOO.tool.Profiler.getFunctionReport("testForAry");
var report2 = YAHOO.tool.Profiler.getFunctionReport("testWhileAry");
var report3 = YAHOO.tool.Profiler.getFunctionReport("testDoWhileAry");
var report4 = YAHOO.tool.Profiler.getFunctionReport("testForInAry");

console.log(report1);
console.log(report2);
console.log(report3);
console.log(report4);

測試結果：
  
 
可見，do-while比for和while慢些，但是這幾乎可以忽略，而for-in卻真的很糟糕，慢了100倍左右。在實際的工作中很少會遇到測試時這種瘋狂的迴圈，但還是需要注意儘可能少用for-in迴圈，不過當遍曆一個對象（而非一個簡單的數組）中的屬性時，for-in迴圈就是一個很好的幫手，在《高效能JavaScript》中還介紹了許多提高迴圈遍曆的技巧，以後做詳細介紹。

 

摘自  Miser