前端js優化方案(二)持續更新

由於上篇篇幅過長,導致編輯出了問題,另開一篇文章繼續:

4)減少迭代次數,最廣爲人知的一種限制循環迭代次數的模式被稱爲“達夫設備(Duff`s Device)”

 

 

Duff`s Device的理念是:每次循環最多可以調用8process()。循環的迭代次數爲總數除以8由於不是所有數字都能被8整除,變量startAt用來存放餘數,表示第一次循環應該循環多少次。假設總次數爲12,則餘數爲4,代表第一次循環會調用4次process(),第二次循環startAt至爲0,循環8次,這樣就用兩次循環代替了12次循環。(感覺這個方法還是很好的,以後工作中必然用的到)

第二個版本經過了優化,用while取代了switch,將餘數與主循環分開:

這種方式用兩次循環代替了之前的一次徐循環,但是它移除了循環主體中的switch語句,速度比原始循環還快。

不過使用這種方式目的是提高性能,要是循環次數本身就比較少,使用這種方式的效果並不明顯,以1000次循環爲一個分界點,如果超過1000次循環,那麼這樣的執行效率就會明顯提升。

5forEach():此方法便利一個數組的所有成員,並在每個成員上執行一個函數。要運行的函數作爲參數傳給forEach(),並在調用時接收三個參數,分別是:當前的數組項的值、索引以及數組本身。

Items.forEach(function(value,index,arry){ process(value);})

總結:在所有情況下,基於循環的迭代比基於函數的迭代法快8倍;

(二)條件

1If-else對比switch

大多數情況下switch比if-else運行要快;

2、if-else優化

(1)if-else中的條件語句應該總是按照從最大概率到最小概率的順序排列,以確保運行速度最快。

(2)如果一個條件語句需要判斷10次以上,爲了最小化條件判斷的次數,代碼可以重寫爲一系列嵌套的if-else語句;這個適用於多個值域需要測試,單如果是離散值的話,用switch語句更合適;

(三)查找表

當使用查找表示,必須完全拋棄條件判斷語句。這個過程變成數組項查詢或對象成員查詢。當單個鍵和單個值之間存在邏輯映射時,查找表的優勢就能體現出來,switch語句更適合與每個鍵都需要對應一個獨特的動作或一系動作的場合。

(四)遞歸

使用遞歸可以把複雜的算法變得簡單。但是潛在問題是終止條件不明確或缺少終止條件會導致函數長時間運行,並使得用戶界面處於假死狀態;

(五)、迭代算法

任何遞歸能實現的算法同樣可以用迭代來實現。迭代算法通常包含幾個不同的循環,分別對應計算過程的不同方面,雖然這樣會引入他們自身的問題,但是運行一個循環比反覆調用一個函數的開銷要少很多

(六)、Memoization

Memoization他緩存前一個計算結果提供後續使用,避免重複工作。

重寫遞歸階乘函數,防止重複執行

今天就更新到這裏,後續還會繼續更新。。

如果還想了解更多的前端基礎知識,可以關注我的個人博客地址: 小K的前端雜談

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章