Re: どういう順番で表示されるでしょうか？

// どういう順番で表示されるでしょうか？
console.log(1);
(async () => {
console.log(2);
await new Promise(r => {
setTimeout(r, 1000);
console.log(3);
});
console.log(4);
})();
console.log(5);

— Takuo Kihira (@tkihira) 2021年8月21日

1→5→2→4→3 を選んだが誤答だった。正解は一番正答率が低い、1→2→3→5→4 だった。

https://jsbin.com/tejadof/edit?js,console

間違えてしまった理由と、正解の理由を自分の言葉で説明することを試みる。

• async は非同期関数なので async 部分は丸ごと実行が遅延されると思った→（おそらく、）即時関数として実行されているせいで、console.log(5) より先に実行される。そのため console.log(2) が二番目に出力される。
• await の中の setTimeout で 1000ms 後に console.log(3) が実行される、と読み、他の処理は 1000ms もかからないだろうからこれが最後の出力になると思った→ await でブロックするので console.log(3) が三番目に出力されるまで、以降の処理は実行されない。
• console.log(4) よりも console.log(5) が先に出力される理由は、理解できていないので説明できない。