如何讲清楚函数节流？

什么是节流？

幼儿园所有的小朋友每天都要做3件事：

 吃饭、睡觉、打豆豆。

 只有一个小朋友例外，他的名字叫豆豆。 

后来，有一位善良勇敢的小朋友站出来说： 

你们不能这样打他了，这么打下去，会把他打死的 

那我们以后就只能吃饭睡觉了！！ 

所以从现在开始，我们每隔72小时，只能打1次豆豆 

于是大家都纷纷表示赞同并流出了感动的泪水

window.onscroll = functiion(){
     if(页面滚动距离 > 800) 显示按钮
     else 隐藏按钮
}

var lasttime = 0;
window.onscroll = function(){
   var now = new Date().getTime(); //每次触发事件获取当前时间
   if( now-lasttime > 200 ){ //若时间间隔大于了200ms 
       lasttime = now;  //执行代码，并重新计时
       //你的代码
   }
}

我还有张原理图给你看

总结：

用节流的方式，可以保证在一段时间内，只有第一次执行是生效的 

直到超过了设定的时间段，才有机会执行下一次 

大大的降低了原有函数的执行频率 

顾名思义，函数节流。

var lasttime = 0; 
window.onscroll = function(){
   var now = new Date().getTime(); //每次触发事件获取当前时间
   if( now-lasttime > 200 ){ //若时间间隔大于了200ms 
       lasttime = now;  //执行代码，并重新计时
       //你的代码
   }
}

window.onscroll = (function(){
   var lasttime = 0; 
   return function(){
       var now = new Date().getTime(); //每次触发事件获取当前时间
       if( now-lasttime > 200 ){ //若时间间隔大于了200ms
           lasttime = now;  //执行代码，并重新计时
           //你的代码
       }
   }
})()

关于函数节流的应用场景，给大家列举一下，仅供参考