setTimeout()和setInterval() 何时被调用执行

最新推荐文章于 2021-03-27 21:35:53 发布

深沉的简单

最新推荐文章于 2021-03-27 21:35:53 发布

阅读量449

点赞数

分类专栏： BOM 文章标签： BOM

本文链接：https://blog.csdn.net/u013861109/article/details/53571226

版权

本文探讨了JavaScript中的setTimeout()和setInterval()的定义、使用示例及为何它们不会精确按时间间隔执行。JavaScript在单线程环境下运行，定时器仅计划在未来某一时间执行代码，具体执行时间取决于当前线程的空闲情况。了解这一点对于精确时间控制至关重要。文章还讨论了如何避免使用setInterval()时可能出现的多个实例冲突问题，推荐使用setTimeout()来实现更精确的重复定时任务。

摘要由CSDN通过智能技术生成

定义

setTimeout()和setInterval()经常被用来处理延时和定时任务。setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,而setInterval()则可以在每隔指定的毫秒数循环调用函数或表达式，直到clearInterval把它清除。

从定义上我们可以看到两个函数十分类似，只不过前者执行一次，而后者可以执行多次，两个函数的参数也相同，第一个参数是要执行的code或句柄，第二个是延迟的毫秒数。

很简单的定义，使用起来也很简单，但有时候我们的代码并不是按照我们的想象精确时间被调用的，很让人困惑

简单示例

看个简单的例子,简单页面在加载完两秒后，写下Delayed alert!

setTimeout('document.write("Delayed alert!");', 2000);

看起来很合理，我们再看个setInterVal()方法的例子

var num = 0;
var i = setInterval(function() {
    num++;
    var date = new Date();
    document.write(date.getMinutes() + ':' + date.getSeconds() + ':' + date.getMilliseconds() + '<br>');
    if (num > 10)
        clearInterval(i);
}, 1000);

页面每隔1秒记录一次当前时间（分钟