首頁 > web前端 > js教程 > 主體

在for迴圈中length值是否需要快取_javascript技巧

WBOY
發布: 2016-05-16 15:48:41
原創
2030 人瀏覽過

在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   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   div = document.createElement("div");
  document.body.appendChild("div");
}

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

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

以上內容就是針對是否需要快取length值在for迴圈中的全部介紹,希望大家喜歡。

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板