JavaScript 中怎么通过闭包实现延迟执行与任务调度器-js教程-PHP中文网

javascript中可用闭包封装定时逻辑与任务状态实现延迟执行和任务调度器，核心是闭包保存私有变量（如timer、tasks、开关状态），仅暴露add、start、pause等可控接口，确保状态隔离与多实例安全。

javascript 中怎么通过闭包实现延迟执行与任务调度器

JavaScript 中可以通过闭包封装定时逻辑与任务状态，实现延迟执行（如类似 setTimeout 的自定义封装）和简易任务调度器（如周期性、条件触发、优先级队列等）。核心在于：闭包保存私有变量（如定时器 ID、待执行队列、时间戳、开关状态），外部仅暴露可控的接口。

用闭包封装延迟执行（debounced / delayed 函数）

常见场景是防抖（debounce）或简单延后调用。闭包保留上一次的定时器引用，每次触发时清除旧的、设置新的，避免重复执行。

定义一个工厂函数，返回带清除能力的延迟执行函数
内部变量 timer 被闭包持有，外界无法直接访问
返回的对象提供 execute（触发延迟）和 cancel（取消）方法

示例：

function createDelayed(fn, delay) {
  let timer = null;
  return {
    execute(...args) {
      clearTimeout(timer);
      timer = setTimeout(() => fn(...args), delay);
    },
    cancel() {
      clearTimeout(timer);
      timer = null;
    }
  };
}
<p>const delayedLog = createDelayed(console.log, 300);
delayedLog.execute("hello"); // 300ms 后输出
delayedLog.execute("world"); // 取消前一个，重新计时</p>

用闭包实现基础任务调度器（Scheduler）

调度器需管理多个任务、支持添加、暂停、恢复、按时间/条件执行。闭包用来隔离调度状态（如任务队列、运行标志、当前 tick 时间），避免全局污染。

使用数组模拟任务队列，每个任务含 fn、delay、repeat、id 等字段
用 setInterval 或递归 setTimeout 驱动 tick，检查是否到执行时间
所有控制逻辑（add、pause、resume、clear）都通过闭包内方法暴露，不暴露内部数据

示例（轻量级单 tick 调度器）：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

function createScheduler() {
  const tasks = [];
  let isRunning = false;
  let intervalId = null;
<p>const start = () => {
if (isRunning) return;
isRunning = true;
intervalId = setInterval(() => {
const now = Date.now();
for (let i = tasks.length - 1; i >= 0; i--) {
const task = tasks[i];
if (now >= task.nextRun) {
task.fn();
if (task.repeat) {
task.nextRun = now + task.delay;
} else {
tasks.splice(i, 1);
}
}
}
}, 50); // 每 50ms 检查一次
};</p><p>const add = (fn, delay, repeat = false) => {
tasks.push({
fn,
delay,
repeat,
nextRun: Date.now() + delay,
id: Math.random().toString(36).substr(2, 9)
});
};</p><p>const pause = () => {
if (isRunning) {
clearInterval(intervalId);
isRunning = false;
}
};</p><p>const clear = () => {
tasks.length = 0;
};</p><p>return { add, start, pause, clear };
}</p><p>// 使用
const sch = createScheduler();
sch.add(() => console.log("tick"), 1000, true);
sch.start();</p>