数据结构
网络
关系数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何使用 JavaScript 延迟 JavaScript 函数调用？
在本教程中，我们将学习如何在 JavaScript 中延迟函数。当我们希望在指定时间后调用函数时，我们将在 JavaScript 中使用延迟函数。
为了在 JavaScript 函数中提供延迟，我们使用一个名为 setTimeout() 的全局窗口对象。此函数允许我们在执行函数之前提供特定的延迟。
让我们深入了解 setTimeout() 函数的一些功能、语法和许多其他内容。setTimeout() 方法主要需要两个参数，一个是我们需要延迟执行的函数，另一个参数是我们要延迟函数的时间。
语法
在 JavaScript 中延迟函数的语法如下所示：
When function declared inside the setTimeout() method:
setTimeout ( function(){function_body}, time in milliseconds);
or
When function declared outside setTimeout() method:
function function_name();
setTimeout(function_name, time i
n milliseconds);
由于在 setTimeout() 方法中声明的函数是匿名的，因此我们也可以删除 function 关键字并将其替换为箭头函数，如下所示：
setTimeout(()=>{function_body}, time in milliseconds);
让我们看看 setTimeout() 函数的一些示例：
示例 1：在 setTimeout() 方法内部定义函数
延迟在 setTimeout() 函数内部声明的函数的步骤：
声明一个 setTimeout() 函数。
在其中定义一个带有函数体的箭头函数。
声明另一个参数为 3000，它在执行后调用函数时提供了 3 秒的延迟。
我们可以使用以下代码来执行上述任务：
<!DOCTYPE html>
<html>
<body>
<h2>Tutorials Point</h2>
<p> Delaying a function in JavaScript </p>
<p> Wait for 3 seconds to get response </p>
<p id="result"></p>
<script>
setTimeout(()=> {
document.getElementById("result").innerHTML = "Hello, I am here";
}
,3000);
</script>
</body>
</html>
示例 2：在 setTimeout() 方法外部定义函数
延迟在 setTimeout() 函数外部声明并在其内部调用的函数的步骤：
定义一个名为 message 的函数，并在其中编写其函数体。
声明一个 setTimeout() 函数
在其中调用 message 函数。
声明另一个参数为 3000，它在执行后调用函数时提供了 3 秒的延迟。
我们可以使用以下代码来执行上述任务：
<!DOCTYPE html>
<html>
<body>
<h2>Tutorials Point</h2>
<p> Delaying a function in JavaScript </p>
<p> Wait for 3 seconds to get response </p>
<p id="result"></p>
<script>
function message() {
document.getElementById("result").innerHTML = "Hello, I am here";
}
setTimeout(message,3000);
</script>
</body>
</html>
示例 3：在 setTimeout() 方法外部定义带有某些参数的函数
延迟在 setTimeout() 函数外部声明并在其内部调用的带有参数的函数的步骤：
定义一个名为 message 的函数，带有 2 个参数及其函数体。
声明一个 setTimeout() 函数。
在其中调用 message 函数作为第一个参数。
声明另一个参数为 3000，它在执行后调用函数时提供了 3 秒的延迟。
在两个参数之后，我们必须声明另外两个参数，它们是提供给 message 函数中声明的参数的值。
我们可以使用以下 HTML 代码来执行上述任务：
<!DOCTYPE html>
<html>
<body>
<h2>Tutorials Point</h2>
<p> Delaying a function in JavaScript </p>
<p> Wait for 3 seconds to get response </p>
<p id="result"></p>
<script>
function message(a,b) {
let sum=a+b;
document.getElementById("result").innerHTML = "The sum of the two values is "+ sum;
}
setTimeout(message,3000,6,8);
</script>
</body>
</html>
从上面的示例中，我们了解到 setTimeout() 将两个值作为参数，如果应用延迟的函数不包含任何参数，否则 setTimeout() 将接受两个以上参数。我们可以根据需要使用此延迟方法，例如，如果我们想在几秒钟后显示警报，或者我们可以设置一个计时器，然后我们可以使用此方法执行它。
注意− 我们还可以通过调用 clearTimeout() 函数并在其中提供超时 ID 来取消延迟。超时 ID 是我们从 setTimeout() 函数获得的返回值。
95K+ 浏览量
