如何在js中添加定时器

在JavaScript编程中，定时器是一项极为实用的功能，它允许我们在指定的时间间隔执行代码，或者在一定时间后执行一次代码。掌握如何在js中添加定时器，能极大地增强程序的交互性和功能性。

在JavaScript中有两种基本类型的定时器：setTimeout() 和 setInterval()。

setTimeout() 函数用于在指定的毫秒数后执行一次代码。其语法结构为 setTimeout(function, delay, param1, param2,...)。其中，function 是要执行的函数，delay 是延迟的毫秒数，后面的参数是可选的，用于传递给要执行的函数。例如：

setTimeout(function() {
    console.log('这是在2秒后执行的代码');
}, 2000);

这段代码会在两秒后在控制台打印出相应的信息。如果需要传递参数给执行函数，可以这样写：

function greet(name) {
    console.log('你好，' + name);
}
setTimeout(greet, 3000, '张三');

上述代码将在三秒后调用 greet 函数，并传递参数 “张三”。

setInterval() 函数则是按照指定的时间间隔反复执行代码。语法为 setInterval(function, delay, param1, param2,...)。示例如下：

let count = 0;
let intervalId = setInterval(function() {
    count++;
    console.log('当前计数: ' + count);
    if (count === 5) {
        clearInterval(intervalId);
    }
}, 1000);

在这个例子中，代码每秒会执行一次，每次执行都会增加 count 的值并打印。当 count 达到5时，使用 clearInterval() 函数停止定时器。

另外，使用箭头函数能让代码更加简洁：

let num = 0;
let id = setInterval(() => {
    num += 2;
    console.log('新的数值: ' + num);
    if (num === 10) {
        clearInterval(id);
    }
}, 1500);

通过合理运用 setTimeout() 和 setInterval() 这两个定时器函数，以及对应的清除函数 clearTimeout() 和 clearInterval()，开发者可以精准控制代码执行的时间和频率，为网页或应用程序添加各种动态交互效果，提升用户体验。