建議使用 lodash 插件里面的 throttle 函數(shù)來實現(xiàn)
1、節(jié)流函數(shù)簡單原理
/**
* 節(jié)流函數(shù)
* 定義：指連續(xù)觸發(fā)事件但是在 n 秒中只執(zhí)行一次函數(shù)（第一次）
* 作用：節(jié)流會稀釋函數(shù)的執(zhí)行頻率
* param1东亦、param2 為額外定制接受的參數(shù)
*/
function throttle (fn, delay, param1 = '', param2 = '') {
/* 獲取接收的參數(shù)执俩，排除掉前兩位固定的參數(shù) */
const params = [...arguments].splice(2)
/* 用戶執(zhí)行時的時間士嚎，初始值為 0 */
let clickTime = 0
return function () {
/* 用戶執(zhí)行時的時間戳 */
const now = Date.now()
/* 若用戶執(zhí)行時的時間戳 - 用戶執(zhí)行時的時間 > 規(guī)定時間 */
if (now - clickTime > delay) {
/* 執(zhí)行函數(shù)，并將參數(shù)設(shè)置到函數(shù)的 arguments 對象中 */
fn.call(this, ...params)
/* 將用戶執(zhí)行時的時間戳賦值給用戶執(zhí)行時的時間 */
clickTime = now
}
}
}
2昼接、節(jié)流函數(shù)的應(yīng)用
/**
* 某個元素點擊要執(zhí)行的事件
* 假設(shè)要對這個事件進行節(jié)流
*/
function task (params = 'params') {
console.log(1, params);
}
/**
* 節(jié)流函數(shù)的應(yīng)用
*/
$('.dom').on('click', throttle(task, 1000, 'hehe'))
