js设置定时器方法?清除定时器方法?区别是什么?

简介: js设置定时器方法?清除定时器方法?区别是什么?

设置定时器:

1、setTimeout

<script>
    setTimeout(
        function a(){
            alert('hello');
        },1000;    //这里的时间的单位是毫秒。
    );
</script>

2、setinterval

<script>
    setInterval(
        function(){
            console.log('hello');
        },1000    //这里的时间的单位为毫秒,以此时间为间隔重复执行函数
    );
</script>

清除定时器方法:

1.clearTimeout

clearTimeout(timeoutID) :清除只执行一次的定时器(setTimeout函数)。

timeoutID 为调用 setTimeout 函数时所获得的返回值,使用该返回标识符作为参数,可以取消该 setTimeout 所设定的定时执行操作。

 

<script>
 var t1 = setTimeout(   
  function(){
      alert('hello');
  },5000;   //定时器5s后执行 
); 
clearTimeout(t1 , 3000);    //在定时器执行前清除定时器
</script>

2. clearInterval

clearInterval(timeoutID): 清除反复执行的定时器(setInterval函数)。

timeoutID 为调用 setInterval 函数时所获得的返回值,使用该返回标识符作为参数,可以取消该 setInterval 所设定的定时执行操作。

 

<script>
    var t1 = setInterval(
        function () {
            console.log('hello');
        }, 5000   //定时器5s后执行
    );
    clearInterval(t1, 3000);    //轮循定时器开始前清除定时器 
    </script>

总结

1.定时器的使用

只执行一次函数的定时器, 对应的代码是setTimeout()函数

反复执行函数的定时器, 对应的代码是setInterval()函数

2.清除定时器

清除只执行一次函数的定时器, 对应的代码是clearTimeout()函数

清除清除反复执行的定时器, 对应的代码是clearInterval()函数

相关文章
|
2天前
|
监控 JavaScript Java
Node.js中内存泄漏的检测方法
检测内存泄漏需要综合运用多种方法,并结合实际的应用场景和代码特点进行分析。及时发现和解决内存泄漏问题,可以提高应用的稳定性和性能,避免潜在的风险和故障。同时,不断学习和掌握内存管理的知识,也是有效预防内存泄漏的重要途径。
|
16天前
|
JavaScript 前端开发 索引
js中DOM的基础方法
【10月更文挑战第31天】这些DOM基础方法是操作网页文档结构和实现交互效果的重要工具,通过它们可以动态地改变页面的内容、样式和行为,为用户提供丰富的交互体验。
|
16天前
|
缓存 JavaScript UED
js中BOM中的方法
【10月更文挑战第31天】
|
5天前
|
JavaScript 前端开发
js中的bind,call,apply方法的区别以及用法
JavaScript中,`bind`、`call`和`apply`均可改变函数的`this`指向并传递参数。其中,`bind`返回一个新函数,不立即执行;`call`和`apply`则立即执行,且`apply`的参数以数组形式传递。三者在改变`this`指向及传参上功能相似,但在执行时机和参数传递方式上有所区别。
|
16天前
|
JavaScript 前端开发
.js方法参数argument
【10月更文挑战第26天】`arguments` 对象为JavaScript函数提供了一种灵活处理参数的方式,能够满足各种不同的参数传递和处理需求,在实际开发中具有广泛的应用价值。
34 7
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的客户关系管理系统附带文章源码部署视频讲解等
97 2
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的小区物流配送系统附带文章源码部署视频讲解等
128 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物援助平台附带文章源码部署视频讲解等
82 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的宠物交易平台附带文章源码部署视频讲解等
75 4
|
4月前
|
JavaScript Java 测试技术
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
基于springboot+vue.js+uniapp的大学生入伍人员管理系统附带文章源码部署视频讲解等
93 4