【lodash】能不能让JavaScript一个方法一秒钟只执行一次，防止重复调用？

使用 Lodash 库来实现这个功能会更加简洁和方便。Lodash 提供了 _.throttle 函数，可以直接满足你的需求。

🚀 使用 Lodash 实现节流

Lodash 的 _.throttle 函数会创建一个新的节流函数，确保在指定的等待时间内最多只执行一次你传入的函数。

1. 安装并引入 Lodash

首先，你需要在你的项目中安装 Lodash。

npm install lodash

然后，在你的 JavaScript 文件中引入它。

import _ from 'lodash';
// 或者使用 CommonJS
// const _ = require('lodash');

2. 使用 _.throttle

你可以用 _.throttle 包装你的方法，并设置延迟时间为 1000 毫秒（即 1 秒）。

// 假设这是你的原始方法
function myFunction() {
  console.log('方法执行了！', new Date().toLocaleTimeString());
}

// 使用 _.throttle 包装，限制为 1000 毫秒（1秒）执行一次
const throttledFunction = _.throttle(myFunction, 1000);

// 现在，即使你快速连续调用 throttledFunction，
// 它也会在第一次立即执行，然后忽略接下来1秒内的所有调用。
throttledFunction(); // 立即执行
throttledFunction(); // 被忽略
throttledFunction(); // 被忽略

setTimeout(() => {
  throttledFunction(); // 1秒后，可以再次执行
}, 1000);

✨ 进阶用法

_.throttle 还提供了一个可选的配置对象，让你可以更精细地控制函数的执行时机。

• leading: (boolean) 是否在节流周期的开始时立即执行函数。默认为 true。
• trailing: (boolean) 是否在节流周期的末尾时执行函数。默认为 true。

例如，如果你希望函数在节流周期开始时立即执行，但在周期结束时不再执行，可以这样配置：

const throttledFunction = _.throttle(myFunction, 1000, {
  'leading': true,
  'trailing': false
});

这个配置在防止按钮被重复点击等场景中非常有用，因为它能确保第一次点击立即响应，并忽略后续的所有点击，直到冷却时间结束。