時間を巻き戻す await の魔法

Promise と async function の 同期実行される範囲について #JavaScript - Qiita
↑この @juner さんの記事にインスパイアされました。

問題

このコードを実行すると、コンソールにどのように出力されるでしょうか。

let x = 0;
(async () => {
    console.log(x)
    console.log(await (x++))
    console.log(x)
})()
console.log(x)

回答

回答折りたたみ

0
1
0
1

インクリメントしたxの値が巻き戻ってる？！

たねあかし

処理順がこうなっているのが原因です。

let x = 0;
(async () => {
    console.log(x)       // --- 1
    console.log(await (
        x++              // --- 2
    ))                   // --- 4
    console.log(x)       // --- 5
})()
console.log(x)           // --- 3

4のconsole.logが受け取る値は後置なのでインクリメント前、でも3のconsole.logはインクリメントされた値を参照する、ということでした。