笔试题：手写防抖与节流函数

防抖和节流的区别？写一个防抖和节流的函数

节流和防抖在面试者经常考到，首先我们看概念

一.概念

防抖：在事件被触发n秒后再执行回调，如果在这n秒内又被触发，则重新计时
节流：规定在一个单位时间内，只能触发一次函数。如果这个单位时间内触发多次函数，只有一次生效

二.分析

防抖的场景：我们可以想象到使用使用input的onchange事件。用户多次输入，比如在200ms内没有触发onchange事件，我们再去做业务处理
节流的场景：比如有一个动画，执行时间是2s，用户每次点击按钮都会执行一次动画，用户可能会频繁点击，导致动画还没执行完，就又重新开始。我们可以使用节流去限制，用户2s内点击的n次事件，我们只执行一次，2s后执行的事件，我们重新作为新的一次事件计入
理论上：如果用户无限次点击触发一个事件，如果使用防抖，永远不会触发

三.实现

//防抖
function debounced(fn, delay) {
  let timer = null;
  return function (...args) {
    timer = setTimeout(() => {
      fn.call(this, ...args);
    }, delay);
  };
}

//节流
function throttles() {
  let flag = true;
  return function () {
    if (!flag) return;
    flag = false;
    setTimeout((...args) => {
      fn.call(this, ...args);
      flag=true
    }, delay);
  };
}