数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何使用 JavaScript 立即触发 setInterval 循环？
setInteral() 方法允许我们在每个特定时间段后持续触发回调函数。我们可以将回调函数作为第一个参数传递，以便在每个时间段后触发，并将时间段（以毫秒为单位）作为第二个参数传递。
setInterval() 方法在第一次调用回调函数时会延迟指定毫秒数。现在，问题是我们需要立即（在 0 毫秒时）第一次调用回调函数，然后我们需要在给定的时间段内持续调用它。
示例
在下面的示例中，我们创建了 func() 函数，该函数在文档中打印消息。我们使用了 setInterval() 方法，该方法每 3000 毫秒调用一次 func() 函数。
<html>
<body>
<h3> Using the <i> setInteral() </i> method to invoke the particular function continuosly </h3>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
output.innerHTML += "Please wait ...." + "<br>";
function func() {
output.innerHTML += "The func() function is invoked!" + "<br>";
}
setInterval(func, 3000);
</script>
</body>
</html>
在输出中，用户可以观察到 setInteraval() 方法在第一次调用 func() 函数时会延迟 3000 毫秒。
用户可以按照以下方法在第一次调用 func() 函数时延迟 0 毫秒。
第一次调用函数，然后使用 setInterval() 方法
使用 setInterval() 方法在第一次调用函数时不延迟的一种方法是先调用一次函数。
当我们第一次调用函数时，它会在第 0 毫秒执行。之后，setInterval() 方法会在特定时间段后持续执行该函数。
语法
用户可以按照以下语法在使用 setInterval() 方法时在第一次调用函数时不延迟。
func_name() setInterval(func_name, 1000);
在上面的语法中，我们第一次调用了 func_name() 函数，并在每次调用后延迟 1000 毫秒。
示例
在下面的示例中，func() 函数打印我们使用 setInterval() 方法每 1000 毫秒调用一次的消息。为了在第一次调用函数时不延迟，我们第一次调用该函数，然后使用 setInteral() 方法调用该函数。
<html>
<body>
<h3> Invoking the function for the first time and, after that, using the setInteral() method to invoke the particular function continuously. </h3>
<div id = "output"> </div>
</body>
<script>
let output = document.getElementById('output');
function func() {
output.innerHTML += "The func() function is invoked!" + "<br>";
}
func()
setInterval(func, 1000);
</script>
</html>
在 setInterval() 方法中创建一个立即执行函数
立即执行函数会在我们创建它后立即执行函数表达式。因此，我们可以使用立即执行函数表达式在第一次调用函数时不延迟。我们还可以在函数内部使用 setInterval() 方法以特定间隔执行函数。
语法
用户可以按照以下语法使用立即执行函数表达式在使用 setInterval() 方法时执行函数而不延迟。
(function name() {
setInterval(name, 3000);
})()
在上面的语法中，我们在括号中编写了函数表达式，然后编写了开括号和闭括号以立即调用该函数。
示例 3
下面的示例创建一个测试函数，该函数使用 setInterval() 方法在每个间隔后调用。我们将 test() 函数编写为立即执行函数表达式，并在函数内部使用 setInterval() 方法，每 3000 毫秒调用一次 test() 函数。
我们可以观察到输出，即 test 函数在刷新网页时第一次在第 0 毫秒调用，然后每 3000 毫秒调用一次。
<html>
<body>
<h3> Using the immediately invoked function expression to invoke the function without delay for the first time while using the setInteral() method </h3>
<div id = "output"> </div>
<script>
let output = document.getElementById('output');
(function test() {
output.innerHTML += "The test() function is invoked!" + "<br>";
setInterval(test, 3000);
})()
</script>
</body>
</html>
用户学习了如何在第一次调用 setInterval() 方法中使用的函数时不延迟。用户可以第一次调用函数，也可以使用立即执行函数表达式。
建议第一次调用函数，而不是使用立即执行函数表达式，因为它会递归调用函数。在某些间隔之后，当我们在其中使用 setInterval() 方法时，立即执行函数表达式会无限次调用该函数。
4K+ 阅读量
