成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

promise與setTimeout的執(zhí)行順序問題

Alliot / 697人閱讀

摘要：輸出創(chuàng)建輸出第一個過程過后，已經(jīng)輸出了第二步由于其他的優(yōu)先級高于。此時中有兩個任務(wù)按照優(yōu)先級高于所以先輸出，再輸出第三步，任務(wù)列表已經(jīng)執(zhí)行完畢，家下來執(zhí)行由于的優(yōu)先級高于，所以先輸出，再輸出。

有一次在面試題中有做到promise與setTimeout的執(zhí)行順序，當(dāng)時有點(diǎn)懵，執(zhí)行順序還是弄錯了一點(diǎn)點(diǎn)，這里記錄下
1.輸出 
setTimeout(function() {
    console.log(111)
}, 0);
setTimeout(function() {
    console.log(333)
}, 1000);
new Promise(function(resolve){
    console.log(444);
    resolve();
    console.log(555);
}).then(function(){
    console.log(666);
});
console.log(777);
async function test1() {
    console.log("test1");
    await test2();
    console.log("test1 last");
}
async function test2() {
    console.log("test2");
}
test1();

輸出結(jié)果


2.個人理解


首先執(zhí)行同步代碼，然后以事件輪詢的方式執(zhí)行異步代碼


promise中的異步體現(xiàn)在.then()和.catch()中


而promise中的function里的是同步代碼


上面的代碼是先執(zhí)行promise里的同步代碼，然后執(zhí)行腳本里本身的同步代碼


async無論方法是同步還是異步都可以用async關(guān)鍵字來進(jìn)行標(biāo)識


因為用async標(biāo)識只是顯示表明在該方法內(nèi)，可能會用到await關(guān)鍵字使其變?yōu)楫惒椒椒ǎ覍⒃摦惒椒椒ㄟM(jìn)行了明確的劃分，只有用了await關(guān)鍵字時才是異步操作，其余一并為同步操作


同 Generator 函數(shù)一樣，async 函數(shù)返回一個 Promise 對象，可以使用 then 方法添加回調(diào)函數(shù)


當(dāng)函數(shù)執(zhí)行的時候，一旦遇到 await 就會先返回，等到觸發(fā)的異步操作完成，再接著執(zhí)行函數(shù)體內(nèi)后面的語句


await 命令后面的 Promise 對象，運(yùn)行結(jié)果可能是 rejected，所以最好把 await 命令放在 try...catch 代碼塊中


3.其他

在網(wǎng)上還找到了一些資料


參考了這篇文章的一些內(nèi)容 參考文章



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


輸出結(jié)果： 3 4 6 8 7 5 2 1


macro-task: script (整體代碼)，setTimeout, setInterval, setImmediate, I/O, UI rendering. 
micro-task: process.nextTick, Promise(原生)，Object.observe，MutationObserver


第一步. script整體代碼被執(zhí)行，執(zhí)行過程為


創(chuàng)建setImmediate macro-task
創(chuàng)建setTimeout macro-task
創(chuàng)建micro-task Promise.then 的回調(diào)，并執(zhí)行script console.log(3); resolve(); console.log(4); 此時輸出3和4，雖然resolve調(diào)用了，執(zhí)行了但是整體代碼還沒執(zhí)行完，無法進(jìn)入Promise.then 流程。
console.log(6)輸出6
process.nextTick 創(chuàng)建micro-task
console.log(8) 輸出8 



第一個過程過后，已經(jīng)輸出了3 4 6 8


第二步. 由于其他micro-task 的 優(yōu)先級高于macro-task。


此時micro-task 中有兩個任務(wù)按照優(yōu)先級process.nextTick 高于 Promise,所以先輸出7，再輸出5


第三步，micro-task 任務(wù)列表已經(jīng)執(zhí)行完畢，家下來執(zhí)行macro-task. 由于setTimeout的優(yōu)先級高于setIImmediate，所以先輸出2，再輸出1。



優(yōu)先級： promise.Trick()>promise的回調(diào)>setTimeout>setImmediate





正在努力學(xué)習(xí)中，若對你的學(xué)習(xí)有幫助，留下你的印記唄（點(diǎn)個贊咯^_^）




往期好文推薦：



判斷iOS和Android及PC端


純css實現(xiàn)瀑布流（multi-column多列及flex布局）


實現(xiàn)多行文字及單行的省略號


微信小程序之購物車和父子組件傳值及calc的注意事項



           
               
                                           
                       
                 

            
                     
             
               

                   
 文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

                 
                   
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/108748.html

               

                      
               
              

              

                
相關(guān)文章

                
    
                             
                                                                                                    
  • 
                                                
    
                          
    用一道大廠面試題帶你搞懂事件循環(huán)機(jī)制
    
                                                     
    本文涵蓋

面試題的引入
對事件循環(huán)面試題執(zhí)行順序的一些疑問
通過面試題對微任務(wù)、事件循環(huán)、定時器等對深入理解
結(jié)論總結(jié)

面試題
面試題如下，大家可以先試著寫一下輸出結(jié)果，然后再看我下面的詳細(xì)講解，看看會不會有什么出入，如果把整個順序弄清楚 Node.js 的執(zhí)行順序應(yīng)該就沒問題了。
async function async1(){
    console.log(async1 start)
 ...
    
                                                   
                          
    
                                
    
                                    ShowerSun
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    一道setTimeout async promise執(zhí)行順序的筆試題引發(fā)的思考
    
                                                     
    摘要：如果你要問他和誰當(dāng)進(jìn)去的快，要從下面兩個方面考慮結(jié)束時。至于什么，查了很多的資料，了解到一個瀏覽器環(huán)境只能有一個事件循環(huán)，而一個事件循環(huán)可以有多個任務(wù)隊列。

====據(jù)說這是今日頭條去年的一道筆試題，主要考察的是setTimeout async promise執(zhí)行順序
～先雙手奉上這道題目～
   async function async1() {
            consol...
    
                                                   
                          
    
                                
    
                                    soasme
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    JavaScript執(zhí)行順序分析
    
                                                     
    摘要：每個線程的任務(wù)執(zhí)行順序都是先進(jìn)先出在運(yùn)行的環(huán)境中，有一個負(fù)責(zé)程序本身的運(yùn)行，作為主線程另一個負(fù)責(zé)主線程與其他線程的通信，被稱為線程。主線程繼續(xù)執(zhí)行我是第一主線程執(zhí)行完畢，從線程讀取回調(diào)函數(shù)。

前言
上星期面試被問到了事件執(zhí)行順序的問題，想起來之前看《深入淺出Node.js》時看到這一章就忽略了，這次來分析一下JavaScript的事件執(zhí)行順序。廢話少說，正題開始。
單線程JavaScr...
    
                                                   
                          
    
                                
    
                                    chnmagnus
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    夯實基礎(chǔ)-JavaScript異步編程
    
                                                     
    摘要：調(diào)用棧被清空，消息隊列中并無任務(wù)，線程停止，事件循環(huán)結(jié)束。不確定的時間點(diǎn)請求返回，將設(shè)定好的回調(diào)函數(shù)放入消息隊列。調(diào)用棧執(zhí)行完畢執(zhí)行消息隊列任務(wù)。請求并發(fā)回調(diào)函數(shù)執(zhí)行順序無法確定。

異步編程
JavaScript中異步編程問題可以說是基礎(chǔ)中的重點(diǎn)，也是比較難理解的地方。首先要弄懂的是什么叫異步？
我們的代碼在執(zhí)行的時候是從上到下按順序執(zhí)行，一段代碼執(zhí)行了之后才會執(zhí)行下一段代碼，這種方式...
    
                                                   
                          
    
                                
    
                                    shadowbook
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                                       
  • 
                                                
    
                          
    前端基礎(chǔ)進(jìn)階（十二）：深入核心，詳解事件循環(huán)機(jī)制
    
                                                     
    摘要：前端基礎(chǔ)進(jìn)階正是圍繞這條線索慢慢展開，而事件循環(huán)機(jī)制，則是這條線索的最關(guān)鍵的知識點(diǎn)。特別是中正式加入了對象之后，對于新標(biāo)準(zhǔn)中事件循環(huán)機(jī)制的理解就變得更加重要。之后全局上下文進(jìn)入函數(shù)調(diào)用棧。

showImg(https://segmentfault.com/img/remote/1460000008811705);
JavaScript的學(xué)習(xí)零散而龐雜，因此很多時候我們學(xué)到了一些東西，但...
    
                                                   
                          
    
                                
    
                                    whjin
                                    
                                    評論0 
                                    收藏0 
                                
    
                          
    
                      
    
                    
    •  
                                                                           
                

              

              
               

                  
                  
發(fā)表評論

                   
               

              

                

                  
0條評論
   
                
 
                      

              

           

           
        

      
 
    

    
     

      
    

    
    

    
       
       

         
閱讀需要支付1元查看
  
         
     
       

      
  
    
    












<