js节流防抖

JS中的节流和防抖是常用的优化性能的方法。它们的主要作用是控制函数的执行次数，从而提高页面的性能和用户体验。

### 节流

节流（throttle）指的是在一定时间内只执行一次函数，也就是说在一段时间内，不管触发了多少次函数，函数只会执行一次。常用于限制一些高频事件的触发，比如页面滚动、鼠标移动等。

function throttle(fn, delay) {
  let timer = null;
  return function() {
    if (!timer) {
      timer = setTimeout(() => {
        fn.apply(this, arguments);
        timer = null;
      }, delay);
    }
  }
}

上面的代码中，`throttle`函数接收两个参数，分别是要执行的函数和时间间隔，返回一个新的函数。每次调用该函数时，都会判断当前是否已经设置了定时器，如果没有，则设置一个定时器，在指定的时间间隔后执行函数，并将定时器置为null。

### 防抖

防抖（debounce）指的是在一定时间内只执行最后一次触发的函数，也就是说当一个高频事件触发时，在一定时间内不断清除定时器，只有当最后一次触发事件后，定时器才会执行函数。常用于限制一些高频事件的触发，比如输入框输入、窗口大小改变等。

function debounce(fn, delay) {
  let timer = null;
  return function() {
    clearTimeout(timer);
    timer = setTimeout(() => {
      fn.apply(this, arguments);
    }, delay);
  }
}

上面的代码中，`debounce`函数和`throttle`函数类似，也接收两个参数，分别是要执行的函数和时间间隔，返回一个新的函数。每次调用该函数时，都会清除之前设置的定时器，并重新设置一个新的定时器，在指定的时间间隔后执行函数。由于每次触发事件都会清除之前设置的定时器，只有最后一次触发事件后，定时器才会执行函数。