在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循環中的全部介紹,希望大家喜歡。