PPT:定时器有哪些用法

1.背景介绍

我们在任务中一般会遇见过这样的两种定时器，第一种是setTimeOut,第二种是setInterval,这两种定时器有如下的区别：

1、setTimeout允许设置一个超时对象，超时后执行这个对象，但是只执行一次，无周期

2、setInternval允许设置一个超时对象，超时后执行这个对象，周期等于超时对象指定的时间，周期为无限循环

比如你打开一个页面后，想间隔几秒自动跳转到另一个页面，则你就需要采用倒计定时器“setTimeout("function();",delaytime)” ，而如果想将某一句话设置成一个一个字的出现，则需要用到循环定时器“setInterval("function();",delaytime)” 。

2.知识剖析

timename=setTimeout("function();",delaytime);

timename=setInterval("function();",delaytime);

第一个参数“function()”是定时器触发时要执行的动作，可以是一个函数，也可以是几个函数，函数间用“；”隔开即可。比如要弹出两个警告窗口，便可将“function();”换成“alert('第一个警告窗口!');alert('第二个警告窗口!');”；而第二个参数“delaytime”则是间隔的时间，以毫秒为单位，即填写“5000”，就表示5秒钟。

3.常见问题

var t=null;

var i=0;

function a(){

 i++;

 if(i==20){

    return;

 }

 t=setTimeout(a,17);

}

a();

alert(i);

这段代码会出现什么效果？

4.解决方案

结果就是不等循环结束就弹出1了。

其实setTimeout和setInterval这两个定时器一旦触发，就是和js程序并行执行的，也就是他们并不在一个时间线上。计时器的作用是仅仅是做一个计划，那就是每隔一段时间执行一次目标方法。计时器的任务每到那个时间点会完成，但是其它时间会继续执行下面的代码。如上程序，a函数运行到定时器前一句的时候，i的值是1，然后执行定时器，17毫秒远远大过程序的运行时间，于是js不等了继续执行，于是alert（i），也就是1。

5.编码实战

见任务1代码

6.扩展思考

为什么任务一的开始按钮多次点击后会越来越快

7.参考文献

博客http://www.cnblogs.com/shawn-xie/archive/2012/07/03/2574666.html

8.更多讨论

思考下计时器的其他原理