防抖
1 .当调用动作n毫秒内，才会执行该动作，若在n毫秒内又调用此动作讲重新计算执行时间，比如用手一直按住一个弹簧，他将不会弹起直到松手为止。
function debounce(fn,delay){
let timer;
return function(){
let context=this;
let args=arguments;
clearInterval(timer)
//下面设置了一个定时器，其实是在走的，如果在1000设定的那个时间内再次点击的时候，先重置上一个定时器。
timer=setTimeout(function(){
fn.apply(context,args)
},delay)
}
}
document.addEventListener('click', debounce(() => {
console.log('start')
},1000), false);
便于理解的版本
let timer;
document.addEventListener('click',function(){
clearInterval(timer)
timer=setTimeout(()=>{
//想要执行的函数
console.log('23123123123')
},1000)
}, false);
2 .window对象的resize,scroll事件
3 .拖拽时的mousemove事件
4 .射击游戏中的mousedown,keydown事件
5 .文字输入，自动完成的keydown事件
节流
1 .预定一个执行周期，当调用动画的时刻大于等于执行周期则执行该动作，然后进入下一个新周期。比如:将水龙头拧紧直到水滴的形式流出，每隔一段时间，就会有一滴水流出。
function throttle(fn,gaptime){
let _lastTime=null;
return function(){
let _nowTime= +new Date()
if(_nowTime-_lastTime>gaptime || !_lastTime){
fn();
_lastTime=_nowTime
}else{
console.log('正在控制函数触发次数')
}
}
}
let fn=()=>{
console.log('hahah')
}
setInterval(throttle(fn,10000),10)
2 .适合大量事件按时间做平均触发
3 .游戏中的刷新率
4 .dom元素拖拽
5 .canvas画笔功能
6 .都是在时间轴上控制函数的执行次数
7 .关键就是这个是不能用来限制到浏览器的自身触发的事件，比如input里面的onchange事件，只能通过onchange 来限制其他函数的调用频率。
