JS封装节流函数

节流函数是一种常用的优化方法，用于限制一个函数在一定时间内只能执行一次，可以有效避免高频率触发函数执行的问题。下面是一个使用原生JS实现的节流函数及一个例子：

function throttle(func, delay) {
  let timer = null;
  let lastRunTime = 0;

  return function() {
    let context = this;
    let args = arguments;
    let currentTime = Date.now();

    clearTimeout(timer);

    if (currentTime - lastRunTime >= delay) {
      func.apply(context, args);
      lastRunTime = currentTime;
    } else {
      timer = setTimeout(function() {
        func.apply(context, args);
        lastRunTime = Date.now();
      }, delay);
    }
  };
}

// 例子：每隔500ms打印一次当前时间
function printTime() {
  console.log(new Date().toLocaleTimeString());
}

const throttledPrintTime = throttle(printTime, 500);

setInterval(throttledPrintTime, 100);

在上述代码中，throttle函数接受两个参数：func是要节流的函数，delay是限制的时间间隔。返回一个新的函数，在调用新函数时，会根据当前时间判断是否执行func。

在例子中，我们定义了一个printTime函数，用于打印当前时间。我们使用throttle函数对printTime进行节流，将节流后的函数赋值给throttledPrintTime。

然后，我们使用setInterval每100ms调用一次throttledPrintTime函数。由于throttledPrintTime被节流限制为每500ms执行一次，所以实际上每隔500ms才会打印一次当前时间。

这样，通过节流函数可以有效限制函数的执行频率，避免过多的执行次数。