js setInterval setTimeout用法

最新推荐文章于 2024-05-01 15:56:17 发布

原创最新推荐文章于 2024-05-01 15:56:17 发布 · 255 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#js

js 专栏收录该内容

2 篇文章

订阅专栏

本文详细介绍了JavaScript中的setInterval和setTimeout函数，包括它们的使用语法、停止方法以及示例代码。通过实例展示了如何设置定时执行任务以及如何在特定时间后执行一次任务。同时提到了clearTimeout在停止定时器中的应用，并提醒了未指定定时器ID时可能出现的无限循环问题。

主要讲setInterval()的用法。比较简单的内容，如果以后学到其他相关的，再补充吧。

1.setInterval()语法

INTERVAL：填一个数字。单位：毫秒。举个例子，INTERVAL = 1000表示1秒。

在running code的地方写要运行的代码。

效果：每间隔一段时间（INTERVAL设定）运行一次running code

setInterval(()=>{
	//running code
}, INTERVAL);

2.setInterval()停止

如何停止运行？使用clearTimeout()。

注意，要如下所示的形式，明确声明clearTimeout()的对象。

/*
必须有loop的声明和使用，否则会不断运行
*/
let count = 10;
let loop = setInterval(()=>{
	console.log('count = ' + count--);
	if(!count){
		clearTimeout(loop);
	}
}, 1000);

你也可以试试clearTimeout()不加参数是什么效果：无限循环。相当于不加这一行。

let count = 10;
let loop = setInterval(()=>{
	console.log('count = ' + count--);
	if(!count){
		clearTimeout();
	}
}, 1000);

3.setTimeout()

setTimeout()

INTERVAL：填一个数字。单位：毫秒。举个例子，INTERVAL = 1000表示1秒。

在running code的地方写要运行的代码。

效果：经过一段时间再执行running code

setTimeout(()=>{
    console.log('1 second passed...');
},1000);

如果希望效果明显一点，可以把间隔时间设置得再长一点。

setTimeout()常常用来配合说明“异步”相关的内容。setTimeout()和异步，能说的东西也不少，应该会另外写一篇日志来梳理。