什么是防抖和节流有什么区别

本质上是优化高频率执行代码的一种手段

• 防抖: n 秒后在执行该事件，若在 n 秒内被重复触发，则重新计时
• 节流: n 秒内只运行一次，若在 n 秒内重复触发，只有一次生效

代码实现

防抖

  function debounce(fn, wait) {
            var timeout = null;
            return () => {
                if (timeout !== null)
                    clearTimeout(timeout);
                timeout = setTimeout(fn, wait);
            }
        }

节流

   function throttle(fn, delay) {
            var lastTime = 0; // 上一次函数触发的时间
            return () => {
                var nowTime = Date.now();
                if (nowTime - lastTime > delay) {
                    fn(); // method.apply(this) 看你用不用箭头函数
                    lastTime = nowTime;
                }
            }
        }

区别

相同点：

目的都是，降低回调执行频率。节省计算资源

不同点

函数防抖关注一定时间连续触发的事件，只在最后执行一次，而函数节流一段时间内只执行一次