setTimeout异步加载

两道经典的面试题，直接上代码

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

        setTimeout(function(){

            i+=i;

            console.log(i);

        },1000)

    }

    var i = 1;

    console.log(i);

会输出什么呢？先想一想，记下答案。继续下一题

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

        setTimeout(function(){

            i+=i;

            console.log(i);

        },1000)

    }

    console.log(i);

改动很少，结果却相差甚远。先公布正确答案，第一段代码输出：1,2,4,8；第二段代码输出：3，6,12,24。

意不意外？刺不刺激？惊不惊喜？

【代码解析】

　　首先，不要被定时器干扰，误以为它有延迟才会导致这样的结果，你可以尝试把延迟改成“0”或者去掉不写，结果依然相同。

　　引入一个概念-->异步，脱离当前事件队列的处理程序，而且必须等到正常队列里的事件完成后才会执行。

　再来分析以上代码，

　　　　　第一个，看到setTimeout，就知道知道它会在代码块的for循环及最后一个console.log完成后才执行，而且执行三次。毫无疑问，会先输出1，此时 i 的值为 1，再开始执行setTimeout进程，分别输出2,4,8.

　　　　第二个，需要对闭包有一定理解，js中的for循环是不存在私有作用域的，所以for循环最后结束时 i = 3,然后再执行setTimeout，依次是6,12，24.

巴特西

setTimeout异步加载

最新文章

热门文章