定时器
JavaScript提供定时执行代码的功能叫做定时器(timer),主要有SetTimeout()和setInterval()这两个函数来完成。本文就详细介绍一下这两个定时器的用法。
setTImeout()
setTimeout函数用来指定某个函数或某段代码,在多少毫秒之后执行,它返回的是一个整数,表示定时器的编号,以后可以用来取消这个定时器。
var timerId = setTimeout(function | code ,delay)
以上代码中,setTimeout函数接受两个参数,第一个参数function | code
是将要推迟执行的函数名或者一段代码, 第二个参数delay是推迟执行的毫秒数。
一个简单的小例子
console.log(1);
setTimeout('console.log(2)',1000);
console.log(3);
上面的代码输出的结果依次是1,3,2、因为setTimeout指定第二行语句推迟1000毫秒再执行。
需要注意的是,推迟执行的代码必须以字符串的形式放在setTimeout
,因为引擎内部使用eval
函数,将字符串转为代码,如果推迟执行的是函数,则可以直接将函数名放在setTimeout
,一方面eval
函数有安全顾虑,另一方面便于JavaSecript
引擎优化代码,setTimeout
方法一般总是采用函数名的形式,示例如下:
function f(){
console.log(2);
}
setTimeout(f,1000);
//或者
setTimeout(function(){console.log(2)},1000);
setInterval()
setInterval
函数的用法与setTimeout
完全一致,区别在于setInterval
指定某个任务每隔一段时间就执行一次,也就是无限次的定时执行。
var i = 1;
var timer = setInterval(function(){
console.log(i++);
},1000);
上面的代码表示每隔1000毫秒就输出一个2,直到用户点击了停止按钮。之所以用变量timer
接住 就是因为方便控制。
clearTimeout(),clearInterval()
setTimeout
和setInterval
函数,都返回一个表示计数器编号的整数值,将该整数传入clearTimeout
和clearInterval
函数,就可以取消对应的定时器。示例如下:
var id1 = setTimeout(f,1000);
var id2 = setInterval(f,1000);
clearTimeout(id1);
clearInter(id2);