定时器的用法

这里是修真院前端小课堂，每篇分享文从

【背景介绍】【知识剖析】【常见问题】【解决方案】【编码实战】【扩展思考】【更多讨论】【参考文献】

八个方面深度解析前端知识/技能，本篇分享的是：

【 定时器的用法】

大家好，我是IT修真院北京分院第22期的学员杨纲，一枚正直纯洁善良的WEB前端程序员。

1.背景介绍

什么是定时器？

JS提供了一些原生方法来实现延时去执行某一段代码。

我们在JS中一般会使用以下两种定时器

setTimeOut(　)　　setInterval(　)

setTimeout

暂停指定的毫秒数后执行指定的代码

setInternval

间隔指定的毫秒数不停地执行指定的代码。

2.知识剖析

setInterval

语法：window.setInterval(\"javascript function\",milliseconds);

window.setInterval() 方法可以不使用window前缀，直接使用函数setInterval()。

setInterval() 第一个参数是函数（function），第二个参数间隔的毫秒数。

setTimeout

语法：window.setTimeout(\"javascript 函数\",毫秒数);

setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 \"alert(\'5 seconds!\')\"，或者对函数的调用，诸如 alertMsg()\"。

第二个参数指示从当前起多少毫秒后执行第一个参数。

3.常见问题

setInterval多次调用后执行频率为什么越来越快？

setInterval() 的运行模式是按照指定的周期（以毫秒计）来调用函数或计算表达式。

这就使得在某个多次执行或者重复执行事件中创建的setInterval()都会独立的保留下来

4.解决方案

每次调用后清除定时器

window.clearTimeout(int);

window.clearInterval(int)

这两种清除延时的方式，除了语法有区别，清除延时的效果上是等效的，而且无论设置的定时器是哪一种 都可以使用以上任意一种清除掉。

5.编码实战

6.扩展思考

当setInterval()的延迟时间设置为0时意味着什么？

7.更多讨论

Q1:在我们日常工作中，有哪些地方会用到定时器？

Q2:除了前文提到的两种常用的定时器，你还接触过哪些定时器的使用？

Q3:在定时器的使用过程中可能存在哪些问题？

8.参考文献

参考：博客园

菜鸟教程

课后问答：

问：定时器里为什么写的是函数的名字，而不加（）。

答：这里要传入一个函数的形参，涉及到一个形参和实参的问题。

ppt链接：https://ptteng.github.io/PPT/PPT/JS-01-settimeout.html#/19

视频链接：链接:https://pan.baidu.com/s/1jI5kSdS密码: wdmq

今天的分享就到这里啦，欢迎大家点赞、转发、留言、拍砖~

------------------------------------------------------------------------------------------------------------------------

技能树.IT修真院

“我们相信人人都可以成为一个工程师，现在开始，找个师兄，带你入门，掌控自己学习的节奏，学习的路上不再迷茫”。

这里是技能树.IT修真院，成千上万的师兄在这里找到了自己的学习路线，学习透明化，成长可见化，师兄1对1免费指导。快来与我一起学习吧 ！

猛戳这里

作者：古碑先生
链接：https://www.jianshu.com/p/fb71c95f3e22
來源：简书
简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

更多内容，可以加入IT交流群565734203与大家一起讨论交流

这里是技能树·IT修真院：https://www.jnshu.com，初学者转行到互联网的聚集地