js定时器执行

第一种:问题请求代表执行打印出来的是什么?

       
       //定时器执行页面崩溃
        var bo = true;
        setTimeout(function () {
            console.log("定时器执行");
            bo = false;
        }, 1000);
        while (bo) {
            console.log(bo);
        }
        console.log(bo);

分析:js为单线程执行,也到定时器会跳过定时器,执行后面代码,待定时器事件到在执行定时器里面函数。

上面代码的情况,bo为true。页面一直执行while,页面卡死。

     浏览器内核实现允许多个线程异步执行,这些线程在内核制控下相互配合以保持同步.假如某一浏览器内核的实现至少有三个常驻线 程:javascript引擎线程,界面渲染线程,浏览器事件触发线程,除些以外,也有一些执行完就终止的线程,如Http请求线程,这些异步线程都会产 生不同的异步事件,下面通过一个图来阐明单线程的JavaScript引擎与另外那些线程是怎样互动通信的.虽然每个浏览器内核实现细节不同,但这其中的 调用原理都是大同小异.

第二种:最后输出的结果是什么?

        //for循环变量
        var arr = [1,2,3,4];
        for (var i = 0; i < arr.length; i++) {
            setTimeout(function () {
                console.log(arr[i]);
            },1000);
        }
        console.log(i);

结果为:underfind。

解析:最后执行到i为4,arr[4]超出数组。

解决方式:

方法一:

        //let 语句声明一个块级作用域的本地变量,并且可选的将其初始化为一个值。
        //在es6中新增了let命令声明变量,用法和var类似,不过let所声明的变量,只在let命令所在的代码块有效果,for循环的计数器中就很适合let命令
        for (let i = 0; i < arr.length; i++) {
            setTimeout(function () {
                console.log(arr[i]);
            }, 1000);
        }

方法二:

        //加个闭包
        for (let i = 0; i < arr.length; i++) {
            (function (i) {
                setTimeout(function () {
                    console.log(arr[i]);
                }, 1000);
            })(i)
        }
原文地址:https://www.cnblogs.com/zhuyapeng/p/10393065.html