实现一个防抖和节流？

::: tip 推荐 项目中，推荐使用 lodash 库 :::

什么是防抖节流？

1. 防抖（Debouncing）：

   • 定义： 防抖是一种延迟执行的策略，在触发事件后，等待一定的时间间隔，如果在这个间隔内没有再次触发相同事件，就执行相应的函数。
   • 应用场景： 防抖常用于处理输入框输入事件、窗口大小改变等频繁触发的事件，以避免过多地触发相应函数。

   实现方式：

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

2. 节流（Throttling）：

   • 定义： 节流是一种控制执行频率的策略，它确保函数在一定时间间隔内只执行一次，无论触发了多少次事件。
   • 应用场景： 节流常用于滚动事件、鼠标移动事件等高频触发的事件，以保证一定时间内只执行一次函数。

   实现方式：

   function throttle(func, delay) {
     let lastTime = 0;
     return function () {
       const currentTime = new Date().getTime();
       if (currentTime - lastTime >= delay) {
         func.apply(this, arguments);
         lastTime = currentTime;
       }
     };
   }

区别：

• 执行时刻： 防抖在一系列触发事件后等待一段时间执行，而节流在一定时间间隔内执行一次。
• 频率控制： 防抖会等待一定时间，确保在这段时间内没有新的触发事件，而节流是每隔一定时间执行一次，不管触发了多少次事件。

选择使用防抖还是节流取决于具体的应用场景和需求。

考察点

防抖（Debouncing）和节流（Throttling）都是用来限制函数执行频率的技术，特别是在处理用户输入或其他频繁触发的事件时非常有用。它们的目标是减少事件处理或函数执行的次数，从而提高性能和优化用户体验。