关于防抖和节流

在性能优化篇提到了防抖和节流，具体的区别已经知道了，打算手写代码

防抖

function debounce(fn,wait=500){
        let timer;
        return (...args)=>{
            if(timer){
                clearTimeout(timer)
            }
            timer = setTimeout(()=>{
                fn.apply(this,args)
            },wait)
        }
    }

节流(为什么settimeout不用清除，flag的一波操作没看懂，去看一下eventloop)

定时器：

定时器的优缺点与时间戳相反，当时发事件后1秒钟，执行处理函数，在事件间隔内出发时间，等超过时间间隔会再次执行处理函数

 function throttle(fn,wait=1500) {
         let flag=true;
         return (...args)=>{
             if(!flag){
                 return
             }
                 flag=false
                 setTimeout(()=>{
                     fn.apply(this,args)
                     flag=true
                 },wait)
         }
        
    }

时间戳：

时间戳的一个优点：在页面初始化的时候就生成了“初始时间”（不明白初始时间上面有提示），而此时还没有触发scroll时间，等触发时远远超过了时间间隔（假设时间间隔为1秒），所以处理函数会立即执行

时间戳的一个缺点：假设触发事件的间隔是一秒，在距离上一次触发事件的时间还差0.5秒停止触发事件，那一秒过后事件函数也不会执行；

 function throttle(fn,time){
        let lastTime=0
        return function(){
            let now=new Date()
            if(now-lastTime>time){
                fn.apply(this,arguments);
                lastTime=now
            }
        }
    }

结合之后：

 function throttle(func, delay) {
　　var timer = "";
　　var startTime = Date.now();
　　return function() {
　　　　var curTime = Date.now();
　　　　var remaining = delay - (curTime - startTime);
　　　　var context = this;
　　　　var args = arguments;
　　　　clearTimeout(timer);
　　　　if (remaining <= 0) {
　　　　　　func.apply(context, args);
　　　　　　startTime = Date.now();
　　　　} else {
　　　　　　timer = setTimeout(func, remaining);
　　　　}
　　}
}