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)
        }