js學習總結----深刻擴展-js同步與異步編程

JS中的兩種編程思想：同步、異步

JS是單線程的->JS就是個傻子，腦子一根筋，作着當前的這件事情，沒有完成以前，絕對不會作下一件事情

一、同步->上一件事情沒有完成，繼續處理上一件事情，只有上一件事情完成了，纔會作下一件事情(JS中大部分都是同步編程的)

for(var i = 0;i<100000;i++){
            if(i==99999){
                console.log('循環結束了');
            }
        }
        console.log('ok')

for循環就是同步編程的，只有循環結束後，纔會執行下面的代碼。

while(1){}
console.log('ok')

上面代碼的ok永遠不會輸出，由於上面的循環是死循環，循環永遠都不會結束

二、異步->規劃要作一件事情，可是不是當前立馬去執行這件事情，須要等必定的時間，這樣的話，咱們不會等着它執行，而是繼續執行下面的操做，‘只有當下面的事情都處理完成了’，纔會反過頭處理以前的事情；若是下面的事情並無處理完成，無論以前的事情有沒有到時間，都踏踏實實的給我等着

　在JS中異步編程只有四種狀況:定時器都是異步編程的、全部的事件綁定都是異步編程的、Ajax讀取數據的時候，咱們通常都設置爲異步編程、回調函數也是異步編程的

var n = 0;
        window.setTimeout(function(){
            n++;
            console.log(n)//1 (2)
        },1000)
        console.log(n)//0 (1)

var n = 0;
        window.setTimeout(function(){
            n++;
            console.log(n)//1 (1)
        },0)
        console.log(n)//0 (0)

設置定時器爲0的時候，爲何結果仍是同樣的呢？

由於每個瀏覽器對於定時器的等待事件都有一個最小的值，谷歌:5~6ms IE:10~13ms,若是設置的等待時間小於這個值，不起做用，仍是須要等到最小時間才執行的；尤爲是寫0也不是當即執行。

var n = 0;
        window.setTimeout(function(){
            n++;
            console.log(n)//不執行
        },0)
        console.log(n)//0 
        while(1){//死循環
            n++;
        }
        console.log(n)//不執行的

咱們定時器設置的等待時間不必定就是最後執行的時間，若是定時器以後還有其餘的事情正在處理中，無論定時器的時間有沒有到，都是不會執行定時器的。

var n = 0;

        window.setTimeout(function(){
            n+=2;
            console.log(n)//7 (4)
        },20)

        window.setTimeout(function(){
            n+=5;
            console.log(n)//5 (3)
        },5)

        console.log(n);//0 (1)

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

        }

        console.log(n);//0 (2)

下圖是任務隊列的詳解

下面的代碼也能夠用異步的思想解釋原理：由於綁定事件是異步的，因此循環會一直進行下去，當點擊的時候i已經變成了oLis.length

for(var i = 0;i<oLis.length;i++){
            oLis[i].onclick = function(){
                tabChange(i);
            }
        }