节流与防抖

防抖

防抖的定义：给一个固定时间，如果你开始触发动作，并且在这个固定时间内不再有任何动作，我就执行一次，否则我每次都会重新开始计时。

节流

节流的定义：用户会反复触发一些操作，比如鼠标移动事件，此时只需要指定一个“巡视”的间隔时间，不管用户期间触发多少次，只会在间隔点上执行给定的回调函数。

有什么用？

        防抖：可用于input.change实时输入校验，比如输入实时查询，你不可能摁一个字就去后端查一次，肯定是输一串，统一去查询一次数据。

        节流：监听 mousemove、 鼠标滚动等事件，通常可用于：拖拽动画、下拉加载。

代码演示

防抖

function debounce (func, wait = 1000) {
  let timeout;
  return function() {
    let context = this;//保存this指向
    let args = arguments;//拿到event对象
    clearTimeout(timeout);
    timeout = setTimeout(function(){
     func.apply(context,args)
    },wait);
  }
}

节流

function throttle(func, delay) {
    var last = 0;
    return function () {
        var now = Date.now();
        if (now >= delay + last) {
            func.apply(this, arguments);
            last = now;
        }
    }
}