setTimeout & setInterval学习

setTimeout & setInterval学习

在讲setTimeout之前先简单介绍下，js闭包，方法队列和自执行函数，详细介绍之后展开

闭包：B函数在A函数中进行了定义，并且B函数在执行时访问了A函数中的变量对象，A函数的返回对象是B函数，那么A.B函数就被称作闭包

队列：JavaScript在浏览器中运行是单线程的，setTimeout的执行是在整个队列的最后，队列遵循先进先出的规则

自执行函数：申明后立即执行方法，(function(i){...})(i)

setTimeout(function(){...},time)

最简单的demo：setTimeout(function(){console.log("将在一秒后出现")},1000)

这边红框里的10是这个setTimeout的唯一Id,这个Id将在我们手动结束这个setTimeout的时候用到。

clearTimeOut方法：var timer=setTimeout(function(){console.log("将在一秒后出现")},1000)；clearTimeout(timer);

复杂一点的demo：用setTimeout实现计时器的效果

for(var i=0;i<=5;i++){

     setTimeout( function(){

               console.log(i);

         },i*1000);

}

打印结果：

for (var i=1; i<=5; i++) {

    setTimeout((function(i){

        console.log(i);

    })(i),i*1000 );

}

打印结果：

for (var i=1; i<=5; i++) {

    setTimeout((function(i){

           returnfunction(){

              console.log(i);

           }

    })(i),i*1000 );

}

用setInterval实现计时器效果

var i=0;

var a= setInterval(function a(){

console.log(i+2);

i=i+2;

if(i==10){b()};

},2000);

function b(){clearInterval(a)};