节流和防抖本质上都是控制事件执行的频率
防抖是在用户多次触发事件,当用户停止触发事件时,将事件执行一次 (模糊搜索)
节流是在用户多次触发事件过程中,间隔执行事件 (监听用户用户滚动事件,无限加载数据)
// 防抖 @fn 是对应请求数据
// @ms 是用户多次触发事件的时间间隔 是一个毫秒数
function
debounce(fn, ms) {
let timeout =
null
return
function
() {
clearTimeout(timeout)
timeout = setTimeout(() => {
fn.apply(
this
, arguments)
}, ms)
}
}
// 节流 @fn 是对应请求数据
// @ms 是用户多次触发事件的时间间隔 是一个毫秒数
function
throttle(fn, ms){
let flag =
true
return
function
(){
if
(!flag)
return
flag =
false
setTimeout(()=>{
fn.apply(
this
, arguments)
flag =
true
}, ms)
}
}