事件循環(event loop)過程:
一、執行同步(輪詢)階段:
1.同步代碼,一行一行放在Call Stack(調用棧)執行
2.遇到異步,會先記錄到Web APIs里,然后等待時機(定時器、網絡請求等)
3.時機到了,就移動到Callback Queue(回調隊列)
4.當Call Stack(調用棧)清空時,先嘗試DOM渲染,再進入事件循環(event loop)階段
二、執行當前的微任務階段
三、DOM渲染階段
四、事件循環(event loop)階段,執行當前的宏任務:
1.Call Stack(調用棧)為空(即同步代碼執行完),微任務執行完,DOM渲染結束,事件循環(event loop)開始工作
2.事件循環(event loop)輪詢查找Callback Queue(回調隊列),如查找到任務則移動到Call Stack(調用棧)同步執行(輪詢)
3.然后繼續循環查找,直到查找到任務然后移動到Call Stack(調用棧)同步執行(輪詢)
五、四個階段不斷循環:
1.每次Call Stack(調用棧)清空(即每次輪詢結束,一個同步代碼執行階段就是一個輪詢),微任務執行完,都是DOM渲染的時機,DOM結構如有改變則重新渲染,然后觸發下一次事件循環(event loop)
2.如果事件循環(event loop)在Callback Queue(回調隊列)內查找到任務且移動到Call Stack(調用棧)並同步執行(輪詢)完畢,這時Call Stack(調用棧)又清空,又會執行微任務,嘗試DOM渲染,然后又進入事件循環(event loop)階段,執行同步(輪詢)、執行微任務、DOM渲染、事件循環(event loop)四個階段不斷循環