JavaScript定时器：setTimeout与setInterval详解

在JavaScript中，定时器是编程中常用的功能，主要用于在特定时间间隔后执行特定任务。本文将详细讲解两种主要的定时器方法：`setTimeout`和`setInterval`。 `setTimeout`方法用于在指定的毫秒数之后一次性执行指定的函数或代码块。这个方法接收两个主要参数：要执行的函数或字符串代码以及延迟的时间（以毫秒为单位）。例如： ```javascript var timeoutID = window.setTimeout(functionToExecute, delayInMilliseconds); ``` 或者，如果你希望传递参数给执行的函数，你可以这样做： ```javascript var timeoutID = window.setTimeout(function() { functionToExecute(param1, param2); }, delayInMilliseconds); ``` `setTimeout`返回一个唯一的`timeoutID`，这个ID可以用于通过`clearTimeout`方法取消已设置的定时器。例如： ```javascript var timeoutID = setTimeout(function() { console.log('This will be printed once after the specified delay.'); }, 3000); // 清除定时器 clearTimeout(timeoutID); ``` `setInterval`方法与`setTimeout`相似，但它会在指定的毫秒数间隔内持续执行给定的函数或代码块，直到被`clearInterval`方法清除。其使用方式与`setTimeout`几乎一致： ```javascript var intervalID = window.setInterval(functionToExecute, delayInMilliseconds); ``` `setInterval`的例子如下，这个例子会每秒钟减少一个计数器，并在计数器为0时跳转到新的页面： ```javascript var tt = 10; function timeGo() { tt--; document.getElementById("tt").innerHTML = tt; if (tt == 0) { window.location.href = '/'; return false; } } var timer = window.setInterval(timeGo, 1000); // 每秒执行一次 // 当不再需要定时器时，可以清除 // clearInterval(timer); ``` 需要注意的是，`setTimeout`和`setInterval`都受到浏览器的定时器精度限制，它们可能不会精确地按照指定的延迟执行。此外，如果定时器触发时，当前执行栈已经满载，它们可能会被延迟执行。在处理复杂的交互或动画时，这可能会导致性能问题。 `setTimeout`适用于单次的延迟执行，而`setInterval`适合周期性的重复任务。在使用定时器时，确保正确管理它们，避免内存泄漏，尤其是在用户离开页面或关闭组件时记得清除定时器。