js定時器執行
阿新 • • 發佈:2019-02-18
代碼塊 bsp 事件 scrip 不同 length 崩潰 閉包 所在
第一種:問題請求代表執行打印出來的是什麽?
//定時器執行頁面崩潰 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循環變量 vararr = [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) }
js定時器執行