定时器的用法

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

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

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

【 定时器的用法】

大家好，我是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/...

视频链接：链接:https://pan.baidu.com/s/1jI5k...: wdmq

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