(flags)毎日の面接問題-JavaScript実行メカニズム、マクロタスク、マイクロタスク

JavaScript実行メカニズム、マクロタスク、マイクロタスク1.jsは、1つのスレッド言語ブラウザがマルチスレッドである2.同期してメインスレッド3に入ります.非同期にEvent Tableに入り、関数を登録します.指定されたことが完了すると、Event Tableはこの関数をEvent Queに移動します.メインスレッドのタスクを実行した後、対応する関数をEvent Queに読み取りに行きます.このプロセスは繰り返します.つまりEvent Loopイベントサイクルです.scripはマクロタスクが終わってから次のマクロタスクを実行します.その中にミクロタスクがあれば、すべてのミクロタスクを実行します.すべてのミクロタスクを実行した後、次のマクロタスクのマクロタスクmacro-task(マクロタスク)を実行します.全体コードscript、set Timeout、set Intervalミクロタスクmicro-task(マイクロタスク):Promise、process.nextTick(process.nextTick)の意味は、次のポーリングを定義します.下記のコード解析:

console.log('1');

setTimeout(function() {
    console.log('2');
    process.nextTick(function() {
        console.log('3');
    })
    new Promise(function(resolve) {
        console.log('4');
        resolve();
    }).then(function() {
        console.log('5')
    })
})
process.nextTick(function() {
    console.log('6');
})
new Promise(function(resolve) {
    console.log('7');
    resolve();
}).then(function() {
    console.log('8')
})

setTimeout(function() {
    console.log('9');
    process.nextTick(function() {
        console.log('10');
    })
    new Promise(function(resolve) {
        console.log('11');
        resolve();
    }).then(function() {
        console.log('12')
    })
})

最初のマクロタスク:1.最初のマクロタスクscriptは、全体としてメインスレッドに入ると、consosolone.logs出力1.set Timeoutに会って、マクロタスク(今は最初のマクロタスクscriptが実行されていないので、まだマクロタスクに割り当てられていません.)3.次のprocess.nextTickがミクロタスクに割り当てられています.4.Promiseに会って、new Promiseが直接実行し、7を出力します.thenはマイクロタスクEvent Queの中に配られています.この時のミクロタスクテーブル:process.nextTick、Promise.thenは実行結果が6番目のマクロタスク実行結果:1.6番目のマクロタスク:1.2番目のマクロタスクは最初のsetTimeout 2.scriptとの接続順序は同じです.2 process.nextTickを実行すると、ミクロタスクPromiseに割り当てられます.直ちに実行されます.そして、thenはミクロタスク出力結果に割り当てられます.2 3番目のマクロタスクです.3番目のマクロタスクは、2番目のsetTimeoutと2番目のマクロタスクの順に出力されます.9 11,12
練習問題1:

//       setTimeout 
//         async1 .then .then

    console.log('script start')//1
    async function async1() { //async     async2()                     
        await async2()
        console.log('async1 end') //5
    }
    async function async2() {
        console.log('async2 end') //2
    }
    async1()

    setTimeout(function () {
        console.log('setTimeout') // 8
    }, 0)

    new Promise(resolve => {
        console.log('promise') //3
        resolve()
    }).then(function () {
        console.log('promise1') //6
    }).then(function () {
        console.log('promise2') //7
    })

    console.log('script end') //4

練習問題2:

  async function async1() {
        console.log(1);
        const result = await async2();
        console.log(3);
    }

    async function async2() {
        console.log(2);
    }

    Promise.resolve().then(() => {
        console.log(4);
    });

    setTimeout(() => {
        console.log(5);
    });

    async1();
    console.log(6);