js中函式節流與函式防抖

2022-07-05 20:18:12 字數 497 閱讀 7711

函式節流:

概念:設定乙個特定時間,讓函式在特定的事件內只執行一次。

實現原理:settimeout(),控制狀態的鎖

例項:需求:使用者點選按鈕列印「你好!我是知秋y」,並且在點選按鈕後3秒後才能再列印,期間使用者點選列印不會執行列印「你好!我是知秋y」

實現:

函式防抖:

例子:電腦在無操作的2分鐘後將進入休眠狀態,如果使用者在40秒的時候又進行了滑鼠操作,那麼電腦進入休眠的時間又重新記為兩分鐘

實現原理:settimeout()與cleartimeout()

例項:在搜尋時,在接受使用者輸入內容的300毫秒後,執行請求函式;

JS函式節流 函式防抖

函式節流 throttle 函式節流 加入函式節流函式 使用方法 this.refs.throttle.addeventlistener scroll throttle that.console,300 函式防抖 debounce 很明顯,這樣的做法不好的是當使用者輸入第乙個字元的時候,就開始請求判...

函式防抖與函式節流

函式防抖 debounce 當呼叫動作過n毫秒後,才會執行該動作,若在這n毫秒內又呼叫此動作則將重新計算執行時間 函式節流 throttle 預先設定乙個執行週期,當呼叫動作的時刻大於等於執行週期則執行該動作,然後進入下乙個新週期 函式節流 throttle 與函式防抖 debounce 都是為了限...

函式節流與函式防抖

這裡以判斷頁面是否滾動到底部為例,普通的做法就是監聽window物件的scroll事件,然後再函式體中寫入判斷是否滾動到底部的邏輯 這樣做的乙個缺點就是比較消耗效能,因為當在滾動的時候,瀏覽器會無時不刻地在計算判斷是否滾動到底部的邏輯,而在實際的場景中是不需要這麼做的,在實際場景中可能是這樣的 在滾...