Javascript中setTimeOut和setInterval的定时器用法

当我们在JavaScript中需要执行一些需要延迟执行的任务时，使用定时器是一个非常方便的方式。JavaScript提供了两个用于定时器的方法：setTimeOut和setInterval，它们都可以延迟一段时间后执行一段代码。

setTimeOut方法

setTimeOut方法函数会在延迟一定时间后调用一次指定的函数。

语法

setTimeout(function, delay, param1, param2, ...)

• function：需要执行的函数
• delay：延迟时间，以毫秒为单位。如果省略，则默认为0
• param1, param2, ...：可选参数，传递给要调用的函数的参数

示例1

下面是一个简单的setTimeout的示例，延迟1秒钟执行输出“Hello, world!”的代码：

setTimeout(function(){
    console.log("Hello, world!");
}, 1000);

示例2

我们可以使用setTimeout方法来实现一个简单的倒计时计时器：

// 显示倒计时残秒数
function showRemainingTime(remainingTimeInSecond) {
    console.log("倒计时：" + remainingTimeInSecond + "秒");

    if (remainingTimeInSecond > 0) {
        // 递归调用setTimeout方法，实现倒计时效果
        setTimeout(function() {
            showRemainingTime(remainingTimeInSecond - 1);
        }, 1000);
    } else {
        console.log("倒计时结束");
    }
}

showRemainingTime(10); // 倒计时10秒

setInterval方法

setInterval方法函数会按照指定的时间间隔重复调用指定的函数。

语法

setInterval(function, delay, param1, param2, ...)

• function：需要执行的函数
• delay：时间间隔，以毫秒为单位。如果省略，则默认为0
• param1, param2, ...：可选参数，传递给要调用的函数的参数

setInterval会每隔一段时间调用一次指定的函数，直到我们显式地调用clearInterval方法来取消这个函数的调用。我们可以使用setInterval来实现周期性的任务，比如定时发送心跳包，轮询数据等。

示例3

下面是一个简单的setInterval示例，每隔3秒钟执行输出“Hello, world!”的代码：

setInterval(function(){
    console.log("Hello, world!");
}, 3000);

示例4

我们可以使用setInterval方法来实现一个简单的时钟效果：

// 显示当前时间
function showCurrentTime() {
    var currentTime = new Date();
    console.log("当前时间：" + currentTime.toLocaleTimeString());
}

setInterval(showCurrentTime, 1000); // 每隔1秒钟调用showCurrentTime方法，显示当前时间。

以上是Javascript中setTimeOut和setInterval的定时器用法的完整攻略，希望能对你有所帮助。