防抖节流原理

防抖或是节流：限制函数的执行次数

1. 防抖：通过 settimeout的方式，在一定的时间间隔内，将多次触发变成一次触发
2. 节流：减少一段时间的触发频率

 防抖

 实现：

        每一次都要清空定时器，重新设置上计时器值，使得计时器每一次都重新开始，直到最后满足条件并且等待delay时间后，才开始执行handler函数。

适用场景:

1. 按钮提交场景:防止多次提交按钮,只执行最后提交的一次
2. 搜索框联想场景:防止联想发送请求，只发送最后一次输入

function debunce（handler，delay）{ 
   //handler是要传入的进行防抖的函数，delay是等待时间。
    var timer = null;
    return function（）{
        var _self = this，args = arguments; 
        clearTimeout（timer）;        //每次都要清除这个定时器 
        timer = setTimeout（function（）{    //重新开启定时器 
            handler.apply（_self，args）; 
        }，delay）; 
    } 
}

节流

实现：

•         处理程序是要传入的进行节流的函数，wait是上述的间隔时间。
•         使用时间戳进行时间的计算。

适用场景:

1. 拖拽场景:固定时间内只执行一次，防止超高频次触发位置变动
2. 缩放场景:监控浏览器resize使用时间戳实现

        function throttle（handler，wait）{  //handler是要进行节流的函数，wait是等待时间
            var lastTime = 0;
            return function（）{
                var nowTime = new Date（).getTime（）;    //获取当前时间
                if（nowTime - lastTime> wait）{
                    handler.apply（this，arguments）;
                    lastTime = nowTime;      //更新最后时间
                }
            }
        }