for迴圈我們在js遍歷物件或陣列時都會有用到了,一起來看一些關於for迴圈的一些使用例子了,具體的操作細節如下文介紹。
一般寫法如下:
for(var i = 0;i< arr.length;i++) { var a = arr[i]; //... }
這就是一個常見的,正序迴圈的for迴圈。這樣寫的缺點大家都明白:每次都從arr裡取length與i來對比,浪費性能(而且,要是arr的長度是動態變化的,就會出現死循環)。改進這個迴圈的辦法是用變數保存arr.length
:
for(var i = 0, al = arr.length;i< al;i++) { var a = arr[i]; //... }
這樣比第一種可以略微提升點效能,要是陣列長,可以提升更多。
不過這樣寫就多了個變數al,而且這個變數只在用來與i對比的時候有用,看著有點雞肋。
如果循環順序對你不重要,那你可以嘗試倒序循環:
for(var i = arr.length-1;i > -1;i--) { var a = arr[i]; //... }
這樣一來變數少些,且還緩存過arr長度,效能也不錯。但這裡的程式碼寫得有點拙劣(我故意的),首先是i = arr.length-1
(居然要-1,靠),然後是循環繼續執行的條件i > -1 ,都讓有潔癖的人無法忍受。
以下是我常用的倒序for迴圈寫法:
for(var i = arr.length;i--;) { var a = arr[i]; //... }
這已經非常精簡了。原理需要理解:for迴圈繼續執行的條件,是;;之間的這個判斷要為真,而這裡的i–,在第一次迴圈進來的時候,i=arr.length
,i–值不變(為什麼不變?因為要在for循環體裡面,才會發現i變了);當i=1時,i- -還是1,但進入循環體後,就是0了,所以可以正常執行最後一次迴圈;當i=0時,i–還是0,而0已經不為真了,所以迴圈就不會繼續執行了。
大家注意到上面的所有程式碼的for迴圈體裡,都有個var a = arr[i]
,用來取出目前循環到的陣列項目。這其實也是種浪費,而且jsLint等會告訴你:不要在迴圈裡宣告變數。 。 。
倒序的for可以精簡至斯,但我就是要正序,而且要效率高,變數少,怎麼辦?
如下:
for(var i = 0, a;a = arr[i++];) { //... }
這種寫法好處在於:幾乎不可避免的arr.length
不見了,前面說的取出當前循環到的數組項的那一句也不見了。
原則:
a = arr[i++]
,在這裡作為迴圈能執行的條件,注意這裡只有一個=號,所以這不是判斷句,是賦值語句,就是把arr[i++]
賦給a,然後判斷a是不是真值。 i++與i–的原理類型我就不說了,只說當i++已經超過數組的長度時,循環肯定要停止才行,而這裡真的就停止了,為什麼?因為a=arr[i++]
,如果取到了超出數組本身長度的項,只會取得一個undefined,而undefined是假值,循環條件就判斷失敗了。
當然,這樣寫的缺點也很明顯:
1,當arr的長度動態改變時,依然會產生死循環-——因為我們從來沒緩存過arr.length呀。
2,如果循環的是數字數組,則取出的項(即a的值)為0時,就會中止循環(因為0是假值)。
3,當陣列中某一項是假值時(包括空字串,0,null,undefined),同樣會中止循環
所以大家用這種寫法時,最好排除掉上面的情況再用。
這個原理同樣可以用在倒序循環上。
最後忠告大家幾句:
#程式碼精簡不等於效率高!
不要為了故意精簡程式碼而喪失效能
順帶說幾點提高for迴圈效能的要點:
1,適時break!不需要遍歷全部的就要加跳出條件!
2,不要在for迴圈體內宣告變數(建議一次var,多次賦值)
2,陣列長度緩存,盡量少變數
以上是Javascript中for迴圈的幾種用法比較和如何提升效能的詳細內容。更多資訊請關注PHP中文網其他相關文章!