如何实现第一次无延迟地执行 setInterval 函数

当使用 JavaScript 的 setInterval 函数时，通常会遇到一个问题，那就是在第一次执行之前会有一个等待时间，等待时间长度等于设定的间隔时间。如果希望在第一次调用时不延迟，可以通过结合使用 setTimeout 和 setInterval 来解决。

以下是这种方法的具体实现步骤和示例代码：

实现步骤：

1. 立即执行函数：使用 setTimeout 或直接调用的方式，使得需要周期执行的函数能够在代码加载后立即执行。
2. 设置周期执行：在第一次执行后，使用 setInterval 来设置后续的周期性执行。

示例代码：

javascript
function repeatFunction() {
    console.log("这是需要重复执行的函数，执行时间: " + new Date().toLocaleTimeString());
}

// 立即执行一次
repeatFunction();

// 设置间隔周期为 2000 毫秒（2秒）
setInterval(repeatFunction, 2000);

示例说明：

在上述代码中，函数 repeatFunction 会在代码加载后立刻被执行一次，之后每隔 2 秒钟执行一次。这样就解决了 setInterval 在第一次执行前需要等待设置的间隔时间的问题。

替代方案：

另一个方法是封装 setInterval 和第一次立即执行的逻辑到一个自定义函数中，使其更易于复用：

javascript
function setIntervalImmediately(func, interval) {
    func();  // 立即执行函数
    return setInterval(func, interval);  // 然后每隔指定时间执行
}

// 使用封装后的函数
const intervalId = setIntervalImmediately(function() {
    console.log("周期性执行的函数，时间: " + new Date().toLocaleTimeString());
}, 2000);

// 如需要清除定时器，可以使用 clearInterval(intervalId);

这个方法提供了一种更结构化和可重用的方式来处理无延迟地开始周期性任务的需求。