#js#防抖和节流函数

防抖函数

一个连续触发的函数，n秒内只执行一次，连续触发则会重新计算下次触发的时间

/*
* 防抖函数
* @method decounce
* @param{Function} func 触发的函数
* @param{Number} wait 计算下次可以触发的时间
* @param{Boolean} imme 是否立即执行
**/
function decounce(func,wait,imme) {
    //定时器控制变量，闭包的原因一直在内存中
    let timeFlag = null;
    return function() {
    	
    	let context = this;
        let args = arguments;
        //立即执行
        if(imme) {
            //1.timeFlag=null时,执行函数
            if(!timeFlag) func.apply(context,args);
            
            //3.timeFlag有值时,证明定时器开启,控制关闭上一轮的定时器,重新开启新的一轮定时器
            if(timeFlag) clearTimeout(timeFlag);
            
            //2.开启定时器，这时候timeFlag有值,等到定时器时间到了后timeFlag等于null,当timeFlag为null时能下次触发时能执行到func函数
            timeFlag = setTimeout(() => {
            	timeFlag = null;
            },wait)
        }else 
        //非立即执行
        {
        
          //2.timeFlag有值时,证明定时器是开启的,控制关闭上一次的定时器,然后再开启新的一轮定时器
          if(timeFlag) clearTimeout(timeFlag);

          //1.func在wain秒后执行，定时器开启时timeFlag有值     
          timeFlag = setTimeout(()=> {
            func.apply(context,args);
            timeFlag = null;
          },wait)
        }
        
    }
}

节流函数

一个连续触发的函数，每隔n秒内都会执行一次

/*
* 节流函数
* @method throttle
* @param {Function} func 执行的函数
* @param {Number} wait 等待的时间 
**/
function throttle(func,wait) {
	//记录上一次执行的时间,第一次为0;
    let prev = 0;
    return function() {
    	let context = this;
        let args = arguments;
        //当前执行的时间
        let now = Date.now();
        
       	//2,当上一次执行的时间+等待的时间wait>现在的时间;则可以执行函数
        if(now - prev > wait) {
            func.apply(context,args);
            //1,记录上次执行函数的时间
            prev = now;
        }
    }
}