なぜsetTimeoutコードがブロックされたのですか？

Question

function test(){ 
    setTimeout(function(){ 
    var now=new Date(); 
    while((new Date()).getTime() < now.getTime()+5000){ } 
    console.log('p') 
    }, 0); 
} 

test(); 
test(); //it takes 10 seconds,the second test function runs after the first finished. 

誰かが私にそれをどのように説明できますか？あなたがsetTimeoutの内側functionを渡し、それを呼び出すたび、渡された関数はミリ秒単位で供給される遅延に基づいてcallBackキューにプッシュされます、ので

Answer 1

これが起こっています。コールバックキュー内の関数は、プッシュした順に1つずつ実行されます。だからあなたのケースでは、ループを実行して、callBackキュー内にあるfunctionのコードフローをブロックしています。したがって、testの2番目の呼び出しは実行に10秒かかります。

test(); //call 1 
callBack queue ----> [function(){ while(){} }] 

test(); //call 2 
callBack queue ----> [function(){ while(){} }, function(){ while(){} }] 

注：コールスタックに実行するものがない場合、コールバックキューは実行を開始します。

これに最も適したのはEvent Loopです。

Answer 2

あなたは非同期再帰を使って同期whileループを交換する必要があり、非ブロッキング実装したい場合：

function test(x){ 
 
    setTimeout(function loop(now) { 
 
    (new Date()).getTime() < now.getTime()+2000 
 
    ? setTimeout(loop, 0, now) 
 
    : console.log('p', x); 
 
    },0, new Date()) 
 
} 
 

 
test(1); 
 
test(2);