函数防抖和节流

防抖

函数防抖关注一段时间连续触发，只在最后执行一次，而函数节流侧重于一段时间只执行一次。

法师发技能的时候要读条，技能读条没完再按技能就会重新读条

触发事件后在N秒内函数只执行一次，若在N秒内又触发了事件，则会重新计算函数执行时间。

场景：搜索框搜索输入   只需用户最后一次输入完，再发送请求
	手机号、邮箱验证输入检测  onchange  oninput事件
	窗口大小Resize。只需窗口调整完成后，计算窗口大小，防止重复渲染。

//立即执行版本
function debounce(fun,delay){
    let timer = null
    return function (args){
        if (timer)  clearTimeout(timer)
        if(!timer){
            fn.call(this,args);
        }
        timer = setTimeout(()=>{
            fn.call(this,args);
        },delay);
    }
}
let betterFn = debounce(()=>console.log('fn执行'),100)

节流

规定在一个单位时间内，只能触发一次函数。若这个单位时间内触发多次函数，只有一次生效。

射击游戏的射速，就算一直按着鼠标射击，也只会在规定射速内射出子弹。

当持续触发事件时，保证间隔时间触发一次事件
场景：懒加载、滚动加载、加载更多或监听滚动条位置
	百度搜索框、搜索联想功能
	防止高频点击提交，防止表单重复提交

//时间戳版本
function throttle(fn,delay){
	let pre = 0;
    return function(args){
        let now = Date.now();
        if(pre-now>=delay){
            fn.apply(this.args);
            pre = now;
        }
    }
}
let fn = throttle(count,1000)

//定时器版本
function throttle(fun,delay){
    let timer;
    rerurn function(){
        if(!timer){
            timer = setTimeout(()=>{
                timer = null;
                fun.apply(this,args)
            },delay)
        }
    }
}

)]