你所不了解的setTimeout

关于setInterval()和setTimeout()返回值

setInterval(),setTimeout() 会返回一个值,一般认为是ID,将这个ID值传递给clearInterval(),clearTimeout() 可以取消执行,例如:

  1. var intervalTimer=setInterval(function(){
  2. console.log(1)
  3. },3000);
  4. console.log(intervalTimer); //一般是一个数字,Number
  5. button.onclick=function(){
  6. clearInterval(intervalTimer);
  7. };

关于setInterval()和setTimeout()中回调函数中的this

setInterval(),setTimeout() 方法是浏览器 window 对象提供,所以第一个参数函数中的this指向window对象,这跟变量的作用域有关:

  1. var a=1;
  2. var obj={
  3. a:2,
  4. b:function(){
  5. setTimeout(function(){
  6. console.log(this.a);//这里返回的是:1;
  7. },2000);
  8. }
  9. };
  10. obj.b();

当然你可以通过使用bind()方法来改变这个情况:

  1. var a=1;
  2. var obj={
  3. a:2,
  4. b:function(){
  5. setTimeout(function(){
  6. console.log(this.a);//这里返回的是:2;
  7. }.bind(this),2000);//注意这行
  8.  
  9. }
  10. };
  11. obj.b();

关于setInterval()和setTimeout()的参数

大家都知道setInterval()和setTimeout()可以接收两个参数,第一个参数是需要回调的函数,必须传入的参数,第二个参数是时间间隔,毫秒数,可以省略,这个可以看文章的下面,

不传第二个参数,浏览器自动配置时间,在IE,FireFox中,第一次配可能给个很大的数字,100ms上下,往后会缩小到最小时间间隔,Safari,chrome,opera则多为10ms上下。

但是我要说的当然不是这个,我要说的是setInterval()和setTimeout()可以接收更多的参数,那么这些参数是干什么用的呢?从第三个参数开始,依次用来表示第一个参数(回调函数)传入的参数,例如:

  1. setTimeout(function(a,b){
  2. console.log(1+a+b);//这里打印的是:8
  3. },1000,3,4);

当然一些古老的浏览器是不支持的。

关于clearInterval()和clearTimeout()

clearInterval()和clearTimeout()其实是通用的,就是说你可以用 clearInterval() 取消 setTimeout() 执行,clearTimeout()同样可以取消 setInterval() 执行。

  1. var intervalTimer=setInterval(function(){
  2. console.log(1)
  3. },3000);
  4. console.log(intervalTimer);
  5. button.onclick=function(){
  6. clearTimeout(intervalTimer); //注意这里,不是clearInterval哦
  7. };

点击查看更多关于定时器的介绍

posted on 2016-03-23 17:29  flsummer  阅读(186)  评论(1编辑  收藏  举报

导航