防抖和節流

2021-10-09 09:00:10 字數 650 閱讀 5439

解決:表單提交

事件持續觸發的過程中那麼頻繁地去執行函式。

所謂防抖,就是指觸發事件後在 n 秒內函式只能執行一次,如果在 n 秒內又觸發了事件,則會重新計算函式執行時間。

1、非立即執行版

觸發事件後函式不會立即執行,而是在 n 秒後執行,如果在 n 秒內又觸發了事件,則會重新計算函式執行時間。

2、立即執行版

觸發事件後函式會立即執行,然後 n 秒內不觸發事件才能繼續執行函式的效果

3、兩版結合

非立即執行版+立即執行版

所有**如下:

就是指連續觸發事件但是在 n 秒中只執行一次函式。節流會稀釋函式的執行頻率。

1、時間戳版

2、定時器版本

區別:時間戳版的函式觸發是在時間段內開始的時候,

而定時器版的函式觸發是在時間段內結束的時候。

所有**如下:

防抖和節流 什麼是防抖和節流

目錄二 節流 有這樣一種情況,想象有乙個表單,點選提交按鈕就傳送請求給伺服器。如果使用者在很短的時間間隔內 手抖 點選了多次,又或者是惡意點選,那麼就將傳送多個請求。該行為將造成伺服器額外的不必要負載。所謂防抖,實際上就是是處理這種常見的情況的描述。submit該段 當點選submit按鈕的時候,將...

防抖和節流

在前端開發過程中,我們經常需要繫結一些持續觸發事件,如 resize scroll mousemove等等,但有些時候我們並不希望在事件持續觸發的過程中那麼頻繁的去執行函式。通常這種情況下,我們怎麼去解決呢?一般來講,防抖和節流是比較好的解決方案。一 函式的防抖 1 什麼是函式防抖 函式防抖 deb...

防抖和節流

防抖和節流的作用都是防止函式多次呼叫。區別在於,假設乙個使用者一直觸發這個函式,且每次觸發函式的間隔小於設定的時間,防抖的情況下只會呼叫一次,而節流的情況會每隔一定時間呼叫一次函式。1.防抖 函式防抖 debounce n秒內函式只會執行一次,如果n秒內高頻事件再次被觸發,則重新計算時間。如下例,對...