DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 在for循環中length值是否需要緩存
在for循環中length值是否需要緩存
編輯:關於JavaScript     

在for循環中是否需要緩存length值,相信很多程序猿們都糾結過此問題,下面就這一問題的分析請看下文:

在JS性能優化中,有一個常見的小優化,即

// 不緩存 
for (var i = 0; i < arr.length; i++) {
  ...
}

// 緩存
var len = arr.length;
for (var i = 0; i < len; i++) {
  ...
}

那麼,我們就應該摒棄這種寫法嗎?不是的,還有另外一種情況,必須使用這種寫法。

請看例子:
復制代碼 代碼如下:
var divs = document.getElementsByTagName("div"), i, div ;
for( i=0; i<divs.length; i++ ){
  div = document.createElement("div");
    document.body.appendChild("div");
}

以上代碼會導致無限循環:第一行代碼會取得所有的div元素的nodelist,由於nodelist是動態的,因此只要有新的div添加到頁面中,下一次的for循環就會再對divs.length求值,因此i和divs.length每次都會同時遞增,結果他們的值永遠不會相等,就創建了一個死循環。

所以,如果想要迭代一個nodelist最好使用length屬性初始化第二個變量,然後將迭代器與該變量進行比較,修改後的代碼如下:
復制代碼 代碼如下:
var divs = document.getElementsByTagName("div"), i, div ,len ;
for(i=0;len=divs.length;i<len;i++){
  div = document.createElement("div");
  document.body.appendChild("div");
}

這個例子中初始化了len,由於len中保存著divs.length在循環開始時的一個快照,因此會避免上一個例子中出現的無限循環問題,因此當需要對nodelist進行循環迭代的時候,使用這種方法更為保險。

總結:
1.將length的值進行緩存,到底是否有利於性能優化,是一個需要根據具體情況進行判斷的事情,總體來講,減少對DOM的訪問還是有好處的;
2.當需要操作nodelist的時候,建議將length的值進行緩存,可以避免出現死循環。

以上內容就是針對是否需要緩存length值在for循環中的全部介紹,希望大家喜歡。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved