如何在JavaScript中等待X秒

吴欣
958 阅读2分钟

现代编程语言支持sleep()方法来等待程序的执行。由于JavaScript的异步性，它无法使用这个方法。然而，JavaScript使用setTimeout()方法实现了这个任务。该方法具有在代码执行过程中等待x秒的功能，为程序员的特定目的服务。

这篇文章展示了在代码执行过程中等待X秒的方法，其学习成果如下。

    • 如何使用setTimeout()方法等待X秒
    • 例子1：在JavaScript中等待5秒
    • 例子2：在JavaScript中等待3秒

如何使用setTimeout()方法等待X秒？

setTimeout()方法在时间过期时执行一段代码。该方法接受以毫秒为单位的输入时间，并推迟用户定义的执行时间。setTimeout()方法需要两个参数作为参数。第一个参数指的是回调函数，当时间过期时执行。而其他参数代表延迟执行的毫秒数。

注意：1000毫秒是指1秒。

语法

window.setTimeout(funct, millisec);

"funct " 代表回调函数， "millisec " 代表毫秒的数量。

例1：在JavaScript中等待5秒

一个例子是考虑利用JavaScript中的setTimeout()方法来等待5秒。下面提供了代码。

代码

console.log("An example to wait 5 seconds in JavaScript");
console.log("JavaScript");
setTimeout(() => {console.log("World"); }, 5000);

在这段代码中，采用了内置方法setTimeout()来等待5000毫秒（5秒）。之后，在控制台窗口中显示消息"World" 。


输出


在输出窗口中可以看到，"JavaScript "首先被打印出来。等待5秒后，第二个信息"World " 被显示在控制台中。

例2：在JavaScript中等待3秒

由于JavaScript在本质上是异步的，它可以执行并行函数。为此，我们考虑了一个例子，以异步的方式等待3秒。为了这个目的，这里给出了代码。

代码

console.log("An example to wait 3 seconds in JavaScript");
wait();
  async function wait() {
    console.log("Welcome to JavaScript");
    await sleep(3000);
    console.log("Welcome to Linuxhint");
  }
  function sleep(ms) {
    return new Promise(val => setTimeout(val, ms));
  }

下面是对代码的描述。

    • "等待 " 方法是以异步的方式采用的。
    • 在这个方法中，"3000 " 毫秒被传递给sleep()方法，用于延迟3秒。
    • 在sleep() 方法中，"Promise " 对象被用来以异步的方式执行操作。
    • 最后，setTimeout() 方法通过传递毫秒"ms"而被采用。


输出结果


输出显示可执行代码并显示"欢迎使用JavaScript "， 等待3秒后，控制台窗口显示"欢迎使用Linuxhint" 。

总结

JavaScript提供了一个内置的方法setTimeout() 来根据用户的需要等待X秒。这里的 "X "指的是秒的数量。setTimeout()不会破坏程序的流程控制，但会延迟其执行。时间由用户提供，单位是毫秒。这篇文章展示了serTimeout()方法在JavaScript中等待特定秒数的用法。

avatar
文章
阅读
粉丝