防抖与节流 源码

抖功能函数
    function debounce(fn) {
      // 4、创建一个标记用来存放定时器的返回值
      let timeout = null;
      return function() {
        // 5、每次当用户点击/输入的时候，把前一个定时器清除
        clearTimeout(timeout);
        // 6、然后创建一个新的 setTimeout，
        // 这样就能保证点击按钮后的 interval 间隔内
        // 如果用户还点击了的话，就不会执行 fn 函数
        timeout = setTimeout(() => {
          fn.call(this, arguments);
        }, 1000);
      };
    }
fn.call优化参数和this
假如我们需要获取input框中输入的值，如何获取？我们知道在oninput事件触发时会有参数传递，并且触发的函数中this是指向当前的元素节点的

目前我们fn的执行是一个独立函数调用，它里面的this是window，我们需要将其修改为对应的节点对象，而返回的function中的this指向的是节点对象；

目前我们的fn在执行时是没有传递任何的参数的，它需要将触发事件时传递的参数传递给fn，而我们返回的function中的arguments正是我们需要的参数；

节流    
function throttle(fn, interval) {
        var last = 0;
        var timer = null; // 记录定时器是否已经开启
        return function () {
            // this和arguments;
            var _this = this;
            var _arguments = _arguments;
            var now = new Date().getTime();
            if (now - last > interval) {
                if (timer) { //若已经开启，则不需要开启另外一个定时器了
                    clearTimeout(timer);
                    timer = null;
                }
                fn.apply(_this, _arguments);
                last = now;
            } else if (timer === null) { // 没有立即执行的情况下，就会开启定时器
                //只是最后一次开启
                timer = setTimeout(function () {
                    timer = null; // 如果定时器最后执行了，那么timer需要赋值为null
                    fn.apply(_this, _arguments);
                },interval)
            }
        }
    }