js-執行機制之同步、異步、宏任務、微任務


一:同步 & 異步  

同步:js是單線程,按照代碼從上到下的順序執行。多個同步任務組成執行的執行棧。比如:

alert(1); // 主線程上執行當前的同步任務
console.log(2);

  如果不確定點擊alert彈框的內容,在控制台是看不到打印2出現的。

  

 異步:不用等待當前任務的執行,等待異步任務有了執行結果,會放置一個時間到任務隊列中。等待執行棧中的內容執行完畢就安順序執行任務隊列中的任務。

 同步任務、異步任務、執行棧、任務隊列、主線程 個人理解的關系圖如下:

 

 

二:宏任務 & 微任務

  宏任務:

 

 

 

  微任務:

 

 

執行順序:同步 -> 異步 -> 宏任務 -> 微任務

有些說法中是 先微任務 -> 宏任務;其實都一樣,看針對那個任務而言。先微任務 ->宏任務, 微任務是本次宏任務中的,而宏任務是下一次的任務。先宏任務->微任務  是先把本次宏任務結束完成,再進行下一次的宏任務中的微任務。

例如:

setTimeout(() => {
        console.log('異步1任務time1');
        new Promise(function (resolve, reject) {
            console.log('異步1宏任務promise');
            setTimeout(() => {
                console.log('異步1任務time2');
            }, 0);
            resolve();
        }).then(function () {
            console.log('異步1微任務then')
        })
    }, 0);
    console.log('主線程宏任務');
    setTimeout(() => {
        console.log('異步2任務time2');

    }, 0);
    new Promise(function (resolve, reject) {
        console.log('宏任務promise');
        // reject();
        resolve();
    }).then(function () {
        console.log('微任務then')
    }).catch(function () {
        console.log('微任務catch')
    })
    console.log('主線程宏任務2');

  執行結果:

 

參考:微任務、宏任務js異步/同步/微任務/宏任務

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM