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

2021-09-29 10:33:44 字數 1976 閱讀 2874

4)減少迭代次數,最廣為人知的一種限制迴圈迭代次數的模式被稱為「達夫裝置(

的理念是:每次迴圈最多可以呼叫8次

process()

。迴圈的迭代次數為總數除以8,

由於不是所有數字都能被

8整除,變數startat用來存放餘數,表示第一次迴圈應該迴圈多少次。假設總次數為12

,則餘數為

4,代表第一次迴圈會呼叫

4次process()

,第二次迴圈star

tat至為0

,迴圈8次,這樣就用兩次迴圈代替了12次迴圈。(感覺這個方法還是很好的,以後工作中必然用的到)

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

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

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

(5)foreach():此方法便利乙個陣列的所有成員,並在每個成員上執行乙個函式。要執行的函式作為引數傳給foreach(),並在呼叫時接收三個引數,分別是:當前的陣列項的值、索引以及陣列本身。

items.foreach(function(value,index,arry))

總結:在所有情況下,基於迴圈的迭代比基於函式的迭代法快8倍;

(二)條件

1、if-else對比switch

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

2、if-else優化

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

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

(三)查詢表

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

(四)遞迴

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

(五)、迭代演算法

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

(六)、memoization

memoization他快取前乙個計算結果提供後續使用,避免重複工作。

重寫遞迴階乘函式,防止重複執行

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

前端效果 持續更新。。。

1.按下enter鍵,改變下面文字 顏色 實現如下 html部分 text id txt1 value placeholder 商品名稱 sp1 hello js部分 view code 2.全選 取消全選 實現如下 html部分 checkbox id ckall 全選 checkbox name...

前端工作分享( 持續更新)

1.當乙個 form 元素中只有乙個輸入框時,在該輸入框中按下回車應提交該表單。如果希望阻止這一預設行為,可以在 標籤上新增 submit.native.prevent。2.在編寫css元件樣式的時候 要規範化 不要在style寫全域性樣式 否則會影響全域性,用style scoped當前元件加 d...

前端學習雜記(持續更新)

菜鳥 jquery 原始碼之家 飛冰 圖示 漸變色 ant design element ui target blank href border 0 src alt 你好加我 title 你好加我 a 具體操作如下截圖 controls 顯示控制欄 音訊元素h1 css box model不同部分的...